CSS学习的一部分内容

本篇是将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实例示例

其外部样式表：

外部样式表

---

更多学习到的内容我已经放到了 我的Github中的仓库。更多学习的内容来源是从小甲鱼上学习到的。更多内容将不定期更新~~~~~