第四次网页前端培训笔记（CSS P11-12）

4、CSS常用属性设置

4.1 背景

• background-color     设置元素的背景颜色
• background-image     设置元素的背景图像
• background-repeat     设置是否及如何重复背景图像 

   

4.2 文本

• color     文本颜色
• text-align     文本对齐（left，center，right）
• text-decoration     文本修饰（下划线，中划线，上划线，去除所有装饰）
• text-indent     文本缩进（首行缩进）

      

4.3 字体

4.4 对齐方式

• left     左对齐
• right     右对齐
• center     居中
• justify     两端对齐
• inherit     从父元素继承text-align 属性的值

4.5 display属性

• none     隐藏元素
• block     显示元素，变成块级元素，会自动换行
• inline     默认
• inline-block
• list-item

4.6 浮动

• none
• left
• right

    

    

4.7 盒子模型

• 设置2个值：上下一致，左右一致
• 设置3个值：上右下一致，左和右一致

1）padding     内边距

元素可能会变形（少用）

同时设置（如：padding:15px;）

单独设置各边的内边距（padding-top、padding-left、padding-bottom、padding-right）

2）border     边框

• 设置边框宽度、样式、颜色 （border-width、border-style、border-color）
• border-style     点线边框、虚线边框、实线边框（dotted、dashed、solid）默认无边框
• border-collapse     合并边框（separate 默认独立边框、collapse合并边框）

3）margin     外边距

同时设置（如：margin:100px;）

单独设置各边的内边距（margin-top、margin-left、margin-bottom、margin-right）

5、其他

5.1 CSS下拉菜单

 

5.2 导航栏

 

5.3 网页布局设置

• 头部区域
• 菜单导航区域
• 内容区域
• 底部区域