学习html前端到后台— 第七章 css 引入方式

   通常有四种引入方式:

    1:内联样式;将样式内联定义到具体HTML元素上,通常用于精确控制一个html元素

是所有样式中最直接的一种,直接对html标签使用style属性   。 

例子:<p style="color: #FF0000; font-size: 50px;" class="a">床前明月光</p>

解释:他只能对一个标签定义,而且都要在 style的属性里修饰 修改的少可以用这个


   2:内部样式定义:通过在html文档头定义样式单部分来实现,这种方式下,每批CSS样式只能控制一份HTML文档

是将css写在<head>与</head> 之间,并用<style>和</style>来声明

例子:  写在head里面

<style type="text/css">
p{
color: #FF0000; font-size: 50px;
}
</style>

他可以对当前页的所有的这个标签定义,优先级高于1

   3:外部样式文件:将样式与html文档分离,样式文件额外引入,这样,一份样式可控制多分文(通常是这样)

最为普遍 需要常见独立的css文件,用link引用进来

例子:

<link type="text/css" rel="stylesheet" href="css/font.css" />

解释;前面type是固定写法  后面的rel引用的属性,写stylesheet  引用外部样式


   4:导入外部样式文件:类似第三种,只是使用@imporrt来引入外部样式文件

这个类似第三种,不太常见。在style标签之间,  @import”样式文件”或 @import url("样式文件")

例子:写在head里

<style type="text/css">
@import url("css/font.css");
</style>

不太推荐使用这个方法

  

      引入的优先级

顺序:内联>内部>import>link


文章标题:学习html前端到后台— 第七章 css 引入方式
原文地址:http://ruanqq.com/qd/31.html
收录情况:百度收录啦O(∩_∩)O~~
版权说明:若无特别注明,本文皆为“小新博客,阮德鑫个人博客-一个打工的90后的有志青年”原创,转载请保留原文出处!
打赏
X
打赏方式:
  • 支付宝
  • 微信
  • QQ红包

打开支付宝扫一扫

发表评论

游客 表情
送你一朵小花花~

众说纷纭(0)