举例说明css加入网页的3种方式

html-css054

举例说明css加入网页的3种方式,第1张

第一种：外部调用

<html>

<head>

<meta

http-equiv="Content-Type"

content="text/html

charset=utf-8"

/>

<link

rel="stylesheet"

type="text/css"

href="index.css"

media="screen"

/>

</head>

<body>

</body>

</html>

第二种：（不会怎样叫，嵌套？）

<html>

<head>

<meta

http-equiv="Content-Type"

content="text/html

charset=utf-8"

/>

<style

type="text/css">

<!--

.css_1

{

font-size:

9px

font-style:

italic

}

-->

</style>

</head>

<body>

</body>

</html>

第三种：在标签里直接写

<html>

<head>

<meta

http-equiv="Content-Type"

content="text/html

charset=utf-8"

/>

</head>

<body>

<input

type="text"

name="username"

id="username"

maxlength="36"

style="width:150px"/

>

</body>

</html>

粗体的地方就是调用CSS的了。不明白追问。

1.首先打开EditPlus软件，新建一个样式表文件，写入一些样式，如下图所示。

2.接下来我们在建立一个样式表文件，在这个样式表文件中通过import属性导入上一个样式表，如下图所示。

3.然后在html中我们用link标签导入上面声明的样式文件，如下图所示。

4.接下来我们运行HTML文件，我们可以看到虽然只导入了一个样式文件，但是两个样式表的样式都加载进来了，如下图所示。

5.另外在运用import的时候一定不要放在样式下面，如下图所示，这样是不生效的。

6.最后运用import导入样式也不要忘了分号，如下图所示，忘了分号也是不生效的。