css

注解
/* dasdas */
样式几种导入方法
直接引入样式

嵌入样式 内联样式

下面重点说下css选择器
基本选择器
.class、#id、*所有、div标签选择器、

结构选择器
div，p同时选择器、div p子孙后代
div>p子级选择器、div+p紧邻的同级元素选择器、div~p用于选择后面所有兄弟元素

属性选择器
h1[class] {
}
[class]、[class=xxx]、[title~=xxx]title属性包含"xxx"的所有元素、[src*=xxx]包含xxx、[src^=xxx]以什么开始、[src$=xxx]以什么结束

文本控制
font-weight: bold；bolder;normal；lighter
font-size:
em:等于百分数单位
color:文本颜色
line-height：行高
text-indent:字间距
font-style:字符倾斜的样式

text-index：文本缩进
text-align:center文本对齐操作

下面重点讲述
盒子模型
外边距--边界线--内边距--文本

外边距：margin
边距顺序依次为：上、右、下、左
内边距padding
boxing-size：宽度和高度包括内边距和边距
border：边框
border-redius:圆角边框

display:none隐藏元素，block显示为块状元素，inline显示为行元素,不能设置宽和高，inline-block行级块元素，可以设置宽高

visibility:控制元素的显示隐藏，在隐藏后空间位置也保留,hidden

overflow：对溢出进项控制,hidden对溢出内容进行隐藏；scroll显示滚动条；auto根据内容自动处理滚动条

浮动布局:
float:设置浮动后，后面的元素会挤占前面的元素，两个元素都设置浮动，会并排显示，浮动元素的边界不会超过父容器的内边距，另外元素设置浮动后，会变为块元素，就可以设置宽和高，行内元素span设置为float后，变为块状元素后，就可以设置宽和高；通过clear:both清除浮动
overflow:子元素使用浮动后将不占空间，这时父元素高度将为零。通过添加父元素并设置overflow属性来清除浮动。

页面布局注意点：
1、首先根据设计稿确定页面大小(主要指宽度、移动端不需要考虑).如1200px宽度
2、水平分割页面主要区域
3、每个区域按以上两步继续细分

定位处理：

position:选项

relative相对定位
absolute绝对定位
fixed固定定位
sticky粘性定位

位置偏移:top,...

relative相对定位,是相对元素原来的位置控制，当元素发生位置偏移时，原位置留白。
absolute绝对定位，不受文档流影响，就像漂浮在页面中的精灵，绝对定位元素拥有行内块特性。父级元素设置了relative|fixed|sticky,绝对元素将参照父级元素进行定位。