冷雨之家

Dying is the day worth living for

在网页中嵌入css的三种方法

| Comments

留存备忘
假如有一段HTML代码如下:

1
2
3
4
5
6
7
8
<html>
<head>
<title>Hi</title>
</head>
<body>
  <div id="myid" class="myclass"></div>
</body>
</html>

在HTML代码中嵌入CSS有一下三种方法:

1.外链式CSS。编写一个.css文件并且命名为style.css,内容如下:

1
2
3
#myid{
     padding:5px;
    }

然后在HTML代码的<head>标签对,<title>下面改成这样:

1
2
3
4
<head>
   <title>HI</title>
   <link rel="stylesheet" type="text/css" href="style.css">
   </head>

这样就OK了

2.内嵌式CSS。直接在<title>标签加成这样:

1
2
3
4
5
6
7
8
9
10
<head>
   <title>HI</title>
   <style type="text/css">
   <!--
    #myid{
     padding:5px;
     }
    -->
   </style>
   </head>

3.直接式CSS。直接为DIV添加style属性如下:

1
<div id="myid" class="myclass" style="padding:5px;"></div>

Comments