通过css来转换块级元素和内联元素

区分这2种元素最好的方式就是看，该元素是否是独占一行，独占一样的就是块级元素，否则就是内联元素。

将上面的代码存为html文件，就会看到div元素在一行，span元素就是独占一行的。

这个就是css的基本用法。

html文件引入css的3种方式

totonoo

建main.css文件

.text { color: #ffcc00; }

css优先级

第一原则：默认<外部引入<内联样式<行内

第二原则：内联样式 > ID 选择器 > （类选择器 = 属性选择器 = 伪类选择器） > （标签选择器 = 伪元素选择器）

伪类元素：

!important 最高

首先伪类是用单冒号表示：如:link, :visited, :hover, :active, :focus, :first-child, :last-child, :nth-child, :nth-last-child, :not()

然后伪元素用双冒号表示：如::first-letter, ::first-line, ::before, ::after

1.用于链接的几个伪类元素

:link用这个可以设置未被访问的链接的样式

:visited用这个设置已经被访问的链接的样式

:hover 用于设置将鼠标悬浮在链接上的样式

:active用于设置鼠标点击链接时到鼠标松开时的样式

:focus 用于设置用键盘将焦点放在链接上时的样式（如用tab键或者上下键来移动页面焦点时）

position:absolute 绝对定位

position:relative 相对定位

position:fixed 固定定位

子绝父相

使用CSS重置（reset）

css重置库如normalize.css已经被使用很多年了，它们可以为你的网站样式提供一个比较清晰的标准，来确保跨浏览器之间的一致性。

大多数项目并不需要这些库包含的所有规则，可以通过一条简单的规则来应用于布局中的所有元素，删除所有的margin、padding改变浏览器默认的盒模型。

*{ box-sizing:border-box; margin:0; padding:0 }

使用box-sizing声明是可选择，如果你使用下面继承的盒模型形式可以跳过它。

CSS

版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们jiasou666@gmail.com 处理，核实后本网站将在24小时内删除侵权内容。