入门：CSS Ⅰ

横向布局

Ⅰ parent class=”clearfix”
son style=”float: left/right”
Ⅱ parent class=”clearfix”//子元素较多时选用
.son{
float: left/right;
}

HTML与CSS链接

Ⅰ 内连 style属性
Ⅱ style 标签
Ⅲ 外部文件 css link (简历的方法)
Ⅳ import url(./a.css)

导航条的控制

Ⅰ .topNavBar{
position： fixed
top: 0
left: 0
width: 100%
}

背景图的添加

.banner{
height: 500px;
background-image: url(“./images/sun.jpg”);
background-position: center center;
background-size: cover;
}

背景图的虚化

html

cs.banner .mask{height: 500px;
background-color: rgba(0,0,0,0.5);//50%的变黑
}

div 高度由其内部文档流元素的高度和决定

文档流： 文档内元素的流动方向。
内联元素 从左往右流动，阻碍后换行。
块级元素 每一块都占一行，从上往下
word-break: break-all/break-word; 文字打乱

span 高度由其内部字体的参数决定

line-height padding

脱离文档流

写在 css 中 //相对定位
parent position: relative;
son position: absolute;

*{
margin: 0;
padding: 0;
} //所有元素的内外边距为0，即挨边

上下居中用 padding：10px o 10px 0

div 居中 //子元素不能加宽高时加在父或更高一级元素上

//自我介绍卡片居中方式
{
margin-left: auto;
margin-right: auto; //自我介绍卡片居中方式
max-width: ; //最大宽度
}