CSS 小结笔记之三种样式表

chuke5164

于 2019-08-16 11:54:00 发布

阅读量122

点赞数

CC 4.0 BY-SA版权

文章标签： php

原文链接：https://my.oschina.net/u/4181724/blog/3093414

本文详细介绍了CSS的三种引入方式：内部样式表、内联样式和外部样式表，以及多重样式的优先级规则。深入探讨了每种方式的适用场景及注意事项。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

本文转载于:猿2048网站https://www.mk2048.com/blog/blog.php?id=i2ak0hj&title=CSS+%E5%B0%8F%E7%BB%93%E7%AC%94%E8%AE%B0%E4%B9%8B%E4%B8%89%E7%A7%8D%E6%A0%B7%E5%BC%8F%E8%A1%A8

CSS 引入共有三种方式：内部样式表，内联样式（行内样式）表，外部样式表，当然也可以使用多重样式

内联样式

<div style="color:red;font-size:20px">内联样式表</div >

内联样式直接把样式卸载html代码行内，一般仅仅在此样式仅仅只在当前元素上应用时使用，其他情况下尽量不要使用。

内部样式表

<style>
        div {
            color: blue;
            font-size: 20px
        }
    </style>

内部样式表一般写在HTML头部，在<head>标签内用<style>标签括起来。此方式一般使用在当前页面需要使用特殊的样式。

外部样式表

<link rel="stylesheet" href="CSS/Googlefonts.css">

外部样式表是单独将样式写到一个css文件中，并在头部引用。使用外部样式表时要注意如果出现多重样式时样式覆盖带来的问题。

多重样式

当使用多重样式时，多重样式将会重叠为一个，一般而言多个样式表会根据下面的规则重叠为一个，其中4为最高权重

浏览器缺省设置
外部样式表
内部样式表（位于 head 标签内部）
内联样式（在 HTML 元素内部）

多重样式优先级顺序

对于同一个元素的多个样式而言，优先级次序如下，7的优先级最高（!important 规则例外，但一般尽量不要用）：

通用选择器（*）
元素(类型)选择器
类选择器
属性选择器
伪类
ID 选择器
内联样式

本文转载于:猿2048➤https://www.mk2048.com/blog/blog.php?id=i2ak0hj&title=CSS+%E5%B0%8F%E7%BB%93%E7%AC%94%E8%AE%B0%E4%B9%8B%E4%B8%89%E7%A7%8D%E6%A0%B7%E5%BC%8F%E8%A1%A8

转载于:https://my.oschina.net/u/4181724/blog/3093414

评论

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。