CSS2.0 参考手册
CSS(层叠样式表)是前端开发中必不可少的一部分,它可以让我们控制网页的样式和布局。CSS2.0 是早期版本的 CSS,虽然已经被后续版本所取代,但仍然有很多人在使用它。本篇文章将为你介绍 CSS2.0 的各种属性及其用法。
选择器
CSS2.0 支持多种选择器:
- 元素选择器:通过元素名称来匹配 HTML 文档中的元素。
- 类选择器:通过类名来匹配 HTML 文档中的元素。
- ID 选择器:通过 ID 来匹配 HTML 文档中的元素。
- 后代选择器:通过父元素和子元素之间的关系来匹配 HTML 文档中的元素。
- 相邻兄弟选择器:通过相邻兄弟元素之间的关系来匹配 HTML 文档中的元素。
- 属性选择器:通过属性值来匹配 HTML 文档中的元素。
以下是几个例子:
-- ----- -- - - ------ ----- - -- ---- -- ------ - ---------- ----- - -- -- --- -- ----- - ------ ---- - -- ----- -- ------- - - -------------- ----- - -- ------- -- -- - - - ------------ ----- - -- ----- -- ----------------------------- - ------ ---- -
盒模型
盒模型是 CSS 中一个非常重要的概念,指的是 HTML 元素在页面中所占用的空间。CSS2.0 定义了两种不同的盒模型:
- 标准盒模型:元素的宽度和高度仅包括内容区域。
- IE 盒模型:元素的宽度和高度包括内容区域、内边距和边框。
我们可以通过 box-sizing
属性来控制盒模型的类型:
-- ----- -- --- - ----------- ------------ - -- -- --- -- --- - ----------- ----------- -
布局
CSS2.0 提供了多种布局方式,例如浮动、定位和表格布局等。以下是其中的几种:
浮动布局
浮动布局指的是将元素从文档流中移除,并使其向左或向右浮动,直到遇到另一个浮动元素或容器边界为止。我们可以使用 float
属性来实现浮动布局:
--- - ------ ----- ------------- ----- -
定位布局
定位布局指的是将元素摆放在文档中任意位置。我们可以使用 position
属性来实现定位布局,它有三个值可选:
- static:元素在文档流中的默认位置。
- relative:相对于元素本身的位置进行定位。
- absolute:相对于父元素进行定位。
-- ---- -- --- - --------- --------- ---- ----- ----- ----- - -- ---- -- --- - --------- --------- ---- ----- ----- ----- -
表格布局
表格布局指的是将元素放入表格中进行布局。我们可以使用 display
属性来实现表格布局:
-- -------- -- --- - -------- ------ - -- --------- -- ---- - -------- ----------- -
文本
来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/201