html中使用css的方法有哪几种_随笔

1.内联方式（行内样式）

就是在HTML的标签中使用style属性来设置css样式

格式：<html标签 style="属性:值属性:值....">被修饰的内容</html标签>

<p style="color:orangefont-size:18px">在HTML中如何使用css样式</p>

特点：仅作用于本标签。

2. 内部方式（内嵌样式）

就是在head标签中使用标签来设置css样式

格式： <style type="text/css">....css样式代码 </style>

特点：作用于当前整个页面

3. 外部导入方式（外部链入）

3.1 （推荐）就是在head标签中使用标签导入一个css文件，在作用于本页面，实现css样式设置

格式：<link href="文件名.css" type="text/css" rel="stylesheet"/>

3.2 还可以使用import在style标签中导入css文件。

如：<style type="text/css">@import "style.css"</style>

特点：作用于整个网站

他们的优先级：当样式冲突时，就是采用就近原则，是值css属性离被修饰的内容最近的为主。

若没有样式冲突则采用叠加效果。

css用于控制html的样式和布局。

主要分内联样式，内部样式，外部样式。

内联样式就是在html的元素里直接使用css，比如：

<p style="background-color:green">这是一个段落。</p>

这就是直接在元素中用css设置背景颜色。适用于单元素，不会影响其他元素。

内部样式则是把css放在head部分用 <style>标签来定义，比如：

<head>

body {background-color:yellow}

p {color:blue}</style>

</head>

其中body {background-color:yellow}定义了整个body的背景颜色。

p {color:blue}</style>则是定义了页面里面所有文本的文字颜色。

优点是整个html页面都能调用。

第三种则是外部样式，就是把css部分做成单独的css文件，然后再html页面里面引用，比如

<head>

</head>

相当于内部样式的代码部分放入mystyle.css这个文件，然后在此处引用。

外部样式最大的优点是其他html页面也能直接用link直接调用，比如你好几个页面需要类似的风格，那么把相同的布局内容放入CSS文件里面就会非常合适。

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

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

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

欢迎分享，转载请注明来源：内存溢出

html中使用css的方法有哪几种