HTML文件中css样式的引用

1.1、直接在div中使用css样式制作div+css网页

如:

<div style="font-size:14px; color:#FF0000;">内容</div>

1.2、html中使用style标签

在html头部head部分内style标签插入css样式代码如下:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    <html>

    <head>

    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

    <title>css引用</title>

    <style type="text/css">

    .test{ font-size:14px; color:#FF0000}

    </style>

    </head>

    <body>

    <div class="test">内容</div>

    </body>

    </html>

1.3、使用@import引用外部CSS文件

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
    <html> 
    <head> 
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
    <title>css引用</title> 
    <style type="text/css"> 

    @import url(style.css);
  
    </style> 
    </head> 
    <body> 
    <div class="test">内容</div> 
    </body> 
    </html> 

1.4、使用link引用外部CSS文件 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
    <html> 
    <head> 
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
    <title>css引用</title> 
<link rel="stylesheet" href="style.css" type="text/css" />
    </head> 
    <body> 
    <div class="test">内容</div> 
    </body> 
    </html>

 

原文地址:https://www.cnblogs.com/soulsjie/p/7260469.html