css样式表的三种方式

271 阅读1分钟

才学完css有关的内容,今天整理了有关css样式表的内容,和大家分享学习。 按照CSS样式书写的位置(或者引入的方式),CSS样式表可以分为以下三大类:   1、行内样式表(行内式)   2、内部样式表(嵌入式)   3、外部样式表(外链式)   那么什么是行内样式表呢?行内样式,其实从它的名字就可以看出来它的特点,就是直接在 HTML 标签中使用 style 属性设置 CSS 样式。   

稀土掘金 body { background-color:#d0e4fe; } h1 { color:orange; text-align:center; } p { font-family:"Times New Roman"; font-size:20px; } 以上就是行内样式。行内样式用起来很简单,并且很方便。但是其仅对当前的HTML标签起作用,且这种方式不能使内容与表现分离,本质上没有体现css的优势,一般不建议使用。

那么什么是嵌入式css呢?

   1)是写到html页面内部,是将所有的CSS代码抽取出来,单独放到一个style标签中
  (2)style理论上可以放到html的任何一个地方,但通俗的约定放在文档的head标签中

通过此种方式,可以方便控制当前整个页面中的元素样式设置 优缺点:代码结构清晰,但没有实现结构与样式完全分离。

最后一种就是外链式css样式,也是实际开发中使用最多的一种。

 就是把css代码写一个单独的外部文件中,这个css样式文件以“.css”为扩展名,在<head>内(不是在<style>标签内)使用<link>标签将css样式文件链接到HTML文件内。
<!DOCTYPE html>
博雅互动