css 样式的导入的三种方式

html-css013

css 样式的导入的三种方式,第1张

1.行内样式 行内样式只能影响它所在的标签,而且总会覆盖嵌入样式和链接样式。

<p style="font-size: 12pxfont-weight:boldfont-style:italiccolor:red">By adding inline CSS styling to the></p>

2.嵌入样式 嵌入样式的应用范围仅限于当前页面。页面样式会覆盖外部样式表中的样式,但会被行内样式覆盖。

<head>

<style type="text/css">

h1 {font-size:16px}

p {color:blue}

</style>

</head>

3.链接样式

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

样式的写法

例子如下

1 ) p {color:redfont-size:12pxfont-weight:bold}

2 ) h1 {color:bluefont-weight:bold}

h2 {color:bluefont-weight:bold}

h3 {color:bluefont-weight:bold}

3)假设,你在写完前面那条规则后,又想只把h3变成斜体,那可以再为h3写一条规则:

h1, h2, h3 {color:bluefont-weight:bold}

h3 {font-style:italic}

将多个CSS文件导入一个CSS文件中可以通过下面的两种方法来实现。

步骤如下:

1.如果使用链接式,需要使用如下的语句引入外部css文件:

<link href="style.css" rel="stylesheet" type="text/css" />'引入外部链接

2.如果使用导入式,则需要使用如下语句:

<style type="text/css">

@import "style.css"'导入外部链接

</style>