在学习 CSS 的过程中, 经常会用到内嵌, 内联以及外联这三种, CSS 外联和内联, 嵌入的区别是什么? 下面本篇文章给大家介绍一下. 有一定的参考价值, 有需要的朋友可以参考一下, 希望对大家有所帮助.
首先, 从功能上来说, 这 3 个实现的功能是一样的, 都能够达到对内容进行排版修饰.
但是, 从写法上来说, 他们是不同的, 下面我们来一一区分:
1, 内联样式写法
<p style="color:red;"></p>
2, 外联样式写法
是单独写一个以 CSS 为扩展名的文件, 然后在 < head></head > 中使用 < link > 标签, 将 CSS 样式链接到 html 中. 举个例子:
<link href="你的 css 文件地址" rel="stylesheet" type="text/css"></link>
3, 嵌套样式写法
这个可以理解为嵌套, 现在 < body></body > 文本中写下需要的元素标签, 比如 span, 然后在 < head></head > 的 < style type="text/css"></style > 中单独写一个 CSS 样式. 举个例子:
- <head>
- <style type="text/css">
- span{color:re;}
- </style>
- </head>
优先级的不同
三种方式在实际使用中, 权重优先级从高到低: 嵌入 > 内联 > 外联. 比较通用的样式适合抽离出来用外联, 提高复用性, 同时降低样式和内容的耦合; 元素独立的不太多的样式感觉可以用嵌入式方便些.
更多 web 前端自学 https://www.html.cn/ 的相关知识, 请查阅 HTML 中文网 !!
来源: http://www.css88.com/qa/css3/18121.html