Post

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

Posted Updated
By Spring 1 min read

留存备忘
假如有一段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>
css
This post is licensed under CC BY 4.0 by the author.

Comments powered by Disqus.