s
o
u
l
s
j
i
e

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>

 

 

posted @ 2017-07-30 21:09  soulsjie  阅读(1007)  评论(0编辑  收藏  举报
你累吗?累就对了,当你觉得累时证明你在走上坡路!-----NotFoundObject - 2016-12-14 08:43