CSS学习的一部分内容
2018-02-19 本文已影响0人
StrawberrySan
本篇是将CSS中的表格，轮廓，定位，浮动的学习进行的总结。完全个人理解，仅供参考。（耶！！！）
CSS表格
-
CSS表格：
CSS表格属性可以帮助我们极大的改善表格的外观。
-
表格边框（solid）
-
折叠边框（collapse）
-
表格宽高
-
表格文本对齐
-
表格内边距
-
表格颜色
例如以下示例：
CSS表格示例
其外部样式表为：
外部样式表示例
CSS轮廓
CSS轮廓属性包括6种：
- outline（设置轮廓属性）
- outline-color（设置轮廓的颜色）
- outline-style（设置轮廓的样式）
- outline-width（设置轮廓的宽度）
CSS定位-定位
1. CSS定位：
改变元素在在页面上的位置。
2.CSS定位机制：
- 普通流：元素按照其在HTML中的位置顺序决定排布的过程。
- 浮动
- 绝对布局
3.CSS定位属性：
- position属性：把元素都放在一个静态的，相对的，绝对的，或固定的位置中。那么该属性有4个值:
- static（静态的，滚动页面时不会随页面滚动）
- fixed（滚动页面时不发生变化，会随页面滚动）
- relative（相对布局，会适应当前页面）
- absolute（绝对布局，很直很直，和直男一样的布局）
如以下示例（通过Javascript的for循环对position的属性值进行理解）：
position示例
其外部样式表为：
外部样式表示例
PS：其动态效果，可以自行尝试就可以看到。（废话！！）
CSS浮动
1.浮动：
float属性可用的值：
- left：元素向左浮动
- right：元素向右移动
- none：元素不浮动
- inherit：从父级继承浮动属性
2.clear属性：
去掉浮动属性（包括继承来的属性）
clear属性值：
- left，right：去掉元素向左向右浮动。
- both：左右两侧均去掉浮动
- inherit：从父级继承来clear的值
如以下示例：
folat实例示例
其外部样式表：
外部样式表
