-
- 微信用户9536923 2022-08-10
笔记内容笔记内容
- 0赞 · 0采集
-
- 慕粉2207441654 2022-04-24
如果父元素和组元素没有定位，那么该元素将依靠窗口左上角定位
- 0赞 · 0采集
-
- 慕粉2207441654 2022-04-16
position:relative;（标准文档流）
left top
right bottom
1
后写的元素层级更高- 0赞 · 0采集
-
- 平平无奇小丸子 2021-12-14
position absolute 是没有高度的
如果没有设置定位属性其他的元素就按照标准流的摆置
position absolute 再上下
absolute的定位是正常的
- 0赞 · 0采集
-
- 平平无奇小丸子 2021-12-14
改变标准流
position 决定定位
static 默认 按照标准流
relative 相对定位 处于正常的标准流中
absolute 绝对定位
- 0赞 · 0采集
-
- 慕无忌0083601 2021-11-05
- position设置relative属性之后，通过top left right bottom 设置位移距离，相对于普通流中的位置移动
- 0赞 · 0采集
-
- BEE_BABOO 2021-03-18
的谔谔谔谔谔谔谔谔谔谔
- 0赞 · 0采集
-
- BEE_BABOO 2021-03-18
哈哈哈哈哈哈哈哈哈哈哈哈哈
- 0赞 · 0采集
-
- qq_暖阳 2020-11-14
display:none;元素不显示
.nav-li hover:ul{ hover：是一个伪类
display:block鼠标移动到某元素时，取代之前的display:none
- 0赞 · 0采集
-
- 慕粉8081807 2020-09-20
- inherit：继承父类定位
-
截图0赞 · 0采集
-
- 慕粉8081807 2020-09-20
- fixed：固定定位
-
截图0赞 · 0采集
-
- 慕码人5047728 2020-09-19
- 设置left top 以
-
截图0赞 · 0采集
-
- 慕瓜0240298 2020-07-14
- 明年
-
截图1赞 · 0采集
-
- 慕容8210283 2020-04-04
- relative相对于自身位置发生变化
-
截图0赞 · 0采集
-
- 爱慕攻城狮 2020-02-21
{position：relative}相对定位 默认后写的元素大于先写的层级
left ，top，以左上端为原点，向右下移动
例；left：50px
top：0px
即相对于左端移动50px
2、设置left，top属性时，坐标轴往右是x正方向，往下是y轴正方向，设置right或者bottom的时候，会将对应坐标表轴变成反方向，当设置了right，则往左是x轴正方向，当设置了bottom，则往上是y轴正方向。
- 0赞 · 1采集
-
- 爱慕攻城狮 2020-02-21
一、标准流
1、块级元素：div、table表格、H1~H6、p段落、有序无序列表（ol、ul、li)——纵向排列
2、内联元素：a 超链接、span 文字、img 图片、input 空键——横向排列
- 1赞 · 2采集
-
- 阿洋丶 2020-02-19
left：0（px可省略）
- 0赞 · 0采集
-
- 阿洋丶 2020-02-19
盒子模型 通过改变元素内外边距来实现元素的移动
定位 通过元素位置移动改变出现在网页的位置
center top 居中置顶 url 半透明
no-repeat 不平铺
图片居中
left:50%
top:50%
margin-left:-180px
margin-top:-180px
- 0赞 · 0采集
-
- 阿洋丶 2020-02-19
z-index 只作用于有定位属性的元素
子元素层级依附于父元素层级
- 0赞 · 0采集
-
- 阿洋丶 2020-02-19
fixd 固定定位 不受制于任何的元素
inherit 继承父元素的定位属性
- 0赞 · 0采集
-
- 阿洋丶 2020-02-19
relative：相对定位 默认后写的元素大于先写的层级
left ，top，以左上端为原点，向右下移动
例；left：50px
top：0px
即相对于左端移动50px
- 0赞 · 0采集
-
- 阿洋丶 2020-02-19
标准流
块级元素 ：div h1-6 有序无序列表 （ol ul li）p段落 纵向排列
内联元素：img a span文字 input控件 横向排列
- 0赞 · 0采集
-
- qq_宝慕林7419120 2019-12-24
ul li内容
- 0赞 · 0采集
-
- qq_慕码人8225348 2019-12-03
定位 5种方法！！继承等
- 0赞 · 0采集
-
- 洋__ 2019-11-23
设置left，top属性时，坐标轴往右是x正方向，往下是y轴正方向，设置right或者bottom的时候，会将对应坐标表轴变成反方向，当设置了right，则往左是x轴正方向，当设置了bottom，则往上是y轴正方向。======说一个老师没讲出来的更简单的理解，比如设置left:50px，top:50px，翻译过来就是左上，那就以文档流左上角为原点移动50px，如果是right:50px, top:50,翻译过来是右上，那就以文档流的右上角为原点，距离垂交线右边50px,上面50px，即左下各移动50px，其实也可以按照老师说的，当成左边为x轴正方向，下面为y轴正方向，也是左下各移动50px
-
截图2赞 · 0采集
-
- 觉皇小超 2019-10-11
HTML中三大布局方式
标准流（文档流）
浮动
定位
其中标准流存两种元素：
块级元素（div、table、H1~H6、有序无序列表（ol、ul、li）、p）
内联元素（a、span、image、input）
-
截图0赞 · 2采集
-
- 洋__ 2019-10-02
侧边导航栏笔记，并且有居中left和top为50%时margin-top：-的一半处理居中的问题
- 0赞 · 0采集
-
- 慕雪5348528 2019-09-06
- position定位属性，相对定位，绝对定位，固定定位，及z-index
-
截图0赞 · 0采集
-
- 慕仙7321963 2019-08-20
<!DOCTYPE html><html><head><meta charset="UTF-8"><title>侧边栏导航跟随案例</title><style>*{padding: 0;margin:0;}body{height: 3000px;background: pink}.nav li{list-style: none;cursor:pointer;}.nav{position:fixed;left: 0;top: 50%;transform:translateY(-50%);width:160px;height:auto;text-align:center;}.first{line-height: 40px;background: #666;}.first>li{position:relative;}.first>li:hover >.second{display: block;}.second>li:hover >.third{display: block;}.second{display: none;position:absolute;top:0;left:160px;}.second>li{position: relative;width:160px;line-height: 40px;background: #666;}.third{display: none;position:absolute;top:0;left:160px;}.third>li{width:160px;line-height: 40px;background: #666;}</style></head><body><div class="nav"><ul class="first"><li>菜单一<ul class="second"><li>二级菜单1<ul class="third"><li>三级菜单1</li><li>三级菜单2</li><li>三级菜单3</li></ul></li><li>二级菜单2<ul class="third"><li>三级菜单1</li><li>三级菜单2</li><li>三级菜单3</li></ul></li><li>二级菜单3<ul class="third"><li>三级菜单1</li><li>三级菜单2</li><li>三级菜单3</li></ul></li></ul></li><li>菜单二<ul class="second" ><li>二级菜单1<ul class="third"><li>三级菜单1</li><li>三级菜单2</li><li>三级菜单3</li></ul></li><li>二级菜单2<ul class="third"><li>三级菜单1</li><li>三级菜单2</li><li>三级菜单3</li></ul></li><li>二级菜单3<ul class="third"><li>三级菜单1</li><li>三级菜单2</li><li>三级菜单3</li></ul></li></ul></li><li>菜单三<ul class="second"><li>二级菜单1<ul class="third"><li>三级菜单1</li><li>三级菜单2</li><li>三级菜单3</li></ul></li><li>二级菜单2<ul class="third"><li>三级菜单1</li><li>三级菜单2</li><li>三级菜单3</li></ul></li><li>二级菜单3<ul class="third"><li>三级菜单1</li><li>三级菜单2</li><li>三级菜单3</li></ul></li></ul></li></ul></div></body></html>- 0赞 · 0采集
-
- 慕UI7723966 2019-08-08
- Dffff
-
截图0赞 · 0采集
