HTML引入CSS样式三种方法及优先级 CSS样式的写法

朱雀 2021-03-26 13:53 877阅读 0赞

# HTML引入CSS样式三种方法及优先级： #

**方法**

css的样式引用由3种方式。分别为行内样式、内部样式（嵌入式）和外部样式；

行内样式：                  在对象的标记内使用对象的style属性定义适用的样式表属性，格式定义为 :`<div style="内容"><div>`；

内部样式（嵌入式）：是由`<style></style>`标记对放在`<head></head>`中；

外部样式 ：                  是把CSS文件放在网页外面，通过链接<link>使CSS文件对本网页的样式有效，`<link type="text/css" rel="stylesheet"  href="css                                         文件的存放地址">`；

优先级：行内样式最高、内部样式（嵌入式）次之、外部样式优先级最低；

# CSS样式的写法： #

![1173987-20170617122535962-984522987.gif][]

每个属性有一个值。属性和值被冒号分开；如果要定义不止一个属性，则需要用分号将每个声明分开；

分类：

**1、组选择器：**

被分组的选择器可以分享相同的声明，用逗号将需要分组的选择器分开；

h1,h2,h3,h4,h5,h6 { color: green; }

**2、后代选择器：**

通过依据元素在其位置的上下文关系来定义样式；

li strong { font-style: italic; font-weight: normal; }

**3、ID选择器：**

id 选择器以 "\#" 来定义；

#red {color:red;} #green {color:green;}

**4、CLASS类选择**器：

.center {text-align: center;}

**5、伪类选择器：**

<a></a>

a:link {color:red;}

a:visited {color:green;}

**6、继承：**

子元素继承父元素的样式；子元素的子元素同样继承样式；若不想被继承，则其css样式要重写；

[1173987-20170617122535962-984522987.gif]: /images/20210326/1616766951617.gif

发表评论取消回复

表情：

评论列表（有 0 条评论，877人围观）

还没有评论，来说两句吧...

相关阅读

相关 CSS三种样式表、样式表优先级、CSS选择器

一、CSS介绍： 1.1、CSS介绍： CSS，全称是：Cascading Style Sheets，层叠样式表，用于修饰HTML页面的。 CSS编写规则如下所示

水深无声/ 2023年10月15日 20:05/ 0 赞/ 70 阅读

相关 html之css关于引入样式的优先级

结论： `!important>内联样式>内部样式>外部样式` 引入css样式的方法行内式（内联，内嵌） <p style=“font-size:2

Dear 丶/ 2023年06月23日 02:49/ 0 赞/ 38 阅读

相关 css样式引入优先级

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ub

淩亂°似流年/ 2023年06月18日 10:58/ 0 赞/ 43 阅读

相关 HTML引入css样式的三种方式，css选择器的三种样式

文章目录前言一. css样式的三种方式第一种：内联定义方式第二种：样式块

青旅半醒/ 2022年10月05日 00:53/ 0 赞/ 272 阅读

相关 CSS的三种样式以及他们的优先级

w3school上记载，CSS的样式为三种，分为：内联式、嵌入式和外部式三种。内联式css样式就是把CSS代码直接写在现有的HTML标签中 `<p

亦凉/ 2022年06月07日 05:23/ 0 赞/ 287 阅读

相关 css 样式引入的优先级

参考： [https://www.cnblogs.com/shengtianlong/archive/2010/08/11/1797667.html][https_www.cn

- 日理万妓/ 2022年06月04日 08:42/ 0 赞/ 348 阅读

相关 css样式优先级

有时在设置 HTML 元素时，会遇到相互冲突的多个样式。这时，到底是选择哪个的样式呢？看完下面的文章，你就懂了 1.在body上设置样式， <style type=

心已赠人/ 2022年05月29日 13:39/ 0 赞/ 325 阅读

相关 CSS样式引入

我们已经学习了行内、内嵌和外链三种方式来引入我们的 CSS 样式，这里我们再深入探讨下。行内方式通过给元素添加 style 属性来添加样式，如下： <di

小灰灰/ 2022年05月27日 09:44/ 0 赞/ 354 阅读

相关 CSS样式的三种写法以及优先级

1 CSS是什么层叠样式表（cascading style sheets） 2 CSS的作用是一种网页渲染技术，对标签特征属性进行渲染 3CSS的三种写法

古城微笑少年丶/ 2021年12月10日 12:07/ 0 赞/ 448 阅读

相关 HTML引入CSS样式三种方法及优先级 CSS样式的写法

HTML引入CSS样式三种方法及优先级：方法 css的样式引用由3种方式。分别为行内样式、内部样式（嵌入式）和外部样式；行内样式： ...

朱雀/ 2021年03月26日 13:53/ 0 赞/ 878 阅读