经过这一个月的学习,我了解了HTML的骨架、标签与标签的关系。明白了css行内样式,内部样式,外部链接三种引入方式,background的简写方式,background:背景颜色 url 平铺方式 是否固定 X轴 Y轴;背景半透明;.
box {
width: 300px;
height: 300px;
background: rgba(0, 0, 0, .6);
color: #fff;
}
border的综合写法
.box {
width: 300px;
height: 300px;
border:10px solid red;
}
设置正圆border-radius: 50%;
设置胶囊形状 border-radius: 25px;
文字阴影text-shadow: 2px 2px 0px rgba(255, 0, 0, 1);
浮动的特性:元素脱离文档流(标准流),自己的位置空了,其他的元素会补上来;
漏:盒子浮动之后脱离的标准流原来的位置就空了,下面的盒子会补上来;
特点:
1、浮动之后的盒子的显示模式会更改为行内块元素的特点;
2、浮动之后的元素之间的没有缝隙的,紧贴在一起;
3、如果父级盒子不够宽装不下浮动的盒子,盒子会掉下来另起一行;
三种定位方式;
静态定位position:static;
相对定位position:relative;
绝对定位position:absolute;
最后总结css书写的基本顺序:
01、给tab的盒子给固定的宽高
02、设置tab_nav的宽高,然后将里面ul下的li左浮动设置想要的宽高
03、如果导航里面的li有鼠标经过样式或者默认选中样式我们可以单独设置
04、设置tab_box的固定宽高,然后设置路面的对应li的子盒子的宽高
05、由于咱们在实际开发中默认的内容是切换显示,只需要显示一个其他隐藏,我们需要使用display:none;全部隐藏,然后再去给想要显示内容给盒子添加行内样式style=”diapaly:block;” |
|