码迷,mamicode.com
首页 > Web开发 > 详细

css样式引入

时间:2018-03-26 19:17:10      阅读:243      评论:0      收藏:0      [点我收藏+]

标签:动态   har   页面   优先   nbsp   gre   imp   margin   type   

1.  css样式引入HTML方法:四种方式

         样式优先级:行内样式>内嵌式(内部样式)>外部样式(链接式+导入式)(后两者是就近原则)

  • 行内样式:在标签中标记style属性
    <p  style="font-size:14px;color:green;">直接在HTML标签中设置的样式</p>

     

  • 内嵌式(内部样式表):在<head></head>标签对中添加<style></style>标签,然后在<style>标签中写入具体样式
    <head>
        <meta charset="utf-8">
        <title>通信类</title>
        <style type="text/css">
          *{
            padding: 0;
            margin: 0;
         }
        </style>
    </head>

     

  • 导入式(外部样式表):在<head></head>中加<style></style>标签,然后在<style>标签中链入 @import"样式表路径"
    1 <head>
    2       <meta charset="utf-8" />
    3       <title>外部样式表</title>
    4       <style type="text/css">
    5             @import url("样式表路径");
    6       </style>
    7 </head>

     

  • 链接式(外部样式表):在<head></head>中加<link rel="stylesheet" type="text/css" href="样式表路径">
    1 <head>
    2       <meta charset="utf-8" />
    3       <title>外部样式表</title> 
    4       <link rel="stylesheet" type="text/css" href="样式表路径" /> 
    5 </head>

     

 2.  外部样式表之间的区别   

  @import  ?  导入式,

  <link type="text/css" rel="stylesheet">  ?  链接式

     导入式:导入式会在整个网页装载完后再装载CSS文件,所以网页若较大则会先显示无样式的页面,闪烁一下之后,再出现网页的样式。

      :属于CSS2.1 

      :先加载HTML结构在加载CSS文件

   链接式:属于XHTML 

      :优先加载CSS文件到页面

      :若需JavaScrip动态引入CSS文件,只能使用链接式
 

 

css样式引入

标签:动态   har   页面   优先   nbsp   gre   imp   margin   type   

原文地址:https://www.cnblogs.com/cjuan/p/8652476.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!