HTML样式CSS的三种写法_安全

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

行内样式

CSS可以直接放到行内样式中引入即可，比如代码如下图：
<p style="color: blue; background: red;">
hello world！
</p>

嵌入式

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

<style type="text/css">

h1 {color: red;}
</style>
<h1>helloworld</h1>

外部样式表

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

@import url(maincss);

一：嵌入式
用户可在HTML文档头部定义多个style元素，实现多个样式表。<Head>
<style type="text/css">

</style> 二：外部引用式
①可以在多个文档间共享样式表，对于较大规模的网站，将CSS样式定义独立成一个一个的文档，可有效地提高效率，并有利于对网站风格的维护。
②可以改变样式表，而无需更改HTML文档，这也与HTML语言内容与形式分开的原则相一致。
③可以根据介质有选择的加载样式表。<Head>
<link rel="stylesheet" type="text/css" href="Csscss" />
</Head>
三：内联式
使用该属性可以直接指定样式，当然，该样式仅能用于该元素的内容，对于另一个同名的元素则不起作用。 1、样式的属性内容直接跟在将要修饰的文字标记里[如：
2、具体格式： style="font-size:10px;font-color:#ff0000"
例如：修饰单元格里的文字四：导入样式表
<style type="text/css">

</style>
第二：四种样式的优先级
如果这上面的四种方式中的两种用于同一个页面后，就会出现优先级的问题，这里我就不再举例子来说明了，大家在下面自己证明一下下面的结论
四种样式的优先级别是(从高至低)：行内样式、内嵌样式、链接样式、导入样式。

CSS 全称级联样式表 (Cascading Style Sheets)，在实际应用中，一般有以下三种级联方式。
1 外联式
外联式样式表中，CSS 代码作为文件单独存放，如以 stylecss 文件包含所有样式。在 HTML 中的外部级联采用 <link> 标记或者 @import 语句来引入。示例代码如下：
<link rel="stylesheet" href="stylecss" type="text/css" /> //link 链接
@import url("stylecss"); //@import 导入
<link> 和 @import 的异同可参考此文：CSS 外部引用中 link 与 @import 的区别。
2 内联式
门户网站的 CSS 代码通常采用嵌入式，即通常所说的内联方式 (Inline Style)，其使用 <style> 标记将样式定义为内部块对象。示例代码如下：
<style type="text/css">

</style>
内联 CSS 可以有效减少 ><style type="text/css">
style2{ font-family:"宋体"; font-weight:bold; color:#800000;}/类选择器/
#style2{ font-family:"宋体"; font-weight:bold; color:#800000;}/id选择器/
</style>

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

原文地址: https://outofmemory.cn/yw/13171063.html

HTML样式CSS的三种写法

发表评论

评论列表（0条）