HTML样式CSS的三种写法

html-css021

HTML样式CSS的三种写法,第1张

CSS是样式层叠表,有三种引入方式。下面,我们来看看HTML样式CSS的三种写法吧。

01

行内样式

CSS可以直接放到行内样式中引入即可,比如代码如下图:

<p style="color: bluebackground: red">

hello world!

</p>

02

嵌入式

还可以采用潜入方式引入CSS,就是把CSS写到<style>标签中,这种方式比较实用,如下图所示:

<style type="text/css">

h1 {color: red}

</style>

<h1>hello world</h1>

03

外部样式表

还有一种叫做外部样式,也就是把CSS写在另外一张页面上,然后再引用到指定页面就可以了,这种也很常见。

@import url(main.css)

在html网页中引入引入css主要有以下四种方式:

(1)行内式

<p style=”color:red”>网页中css的导入方式</p>

(2)嵌入式

<style type=”text/css”>

P{ color:red }

</style>

嵌入式一般写在head中,对于单个页面来说,这种方式很方便。

(3)导入式

<!-- 导入外部样式:在内部样式表的<style></style>标记之间导入一个外部样式表,导入时用@import。 -->

<style type="text/css">

@import "jisuan.css"

</style>

(4)链接式

<link href="jisuan.css" rel=”stylesheet” type=”text/css” />

导入式和链接式差不多,都是从外部引入css文件。但是链接式对于客户端用户浏览网站时,效果会好些。

1.

第一种方法是行内样式,就是直接把CSS代码添加到html的标签中,作为标签的一种属性存在。

2.

第二种方式是内嵌样式,就是将CSS代码添加到<head></head>之间,并用<style></sty...

3.

第三种方法是链接样式,就是将“页面内容”和“样式代码”分类成两个文件或多个文件,实现html代码和css代码的完全分离。