CSS基本语法

最新推荐文章于 2024-07-21 20:52:32 发布

风九儿

最新推荐文章于 2024-07-21 20:52:32 发布

阅读量587

点赞数 2

分类专栏： CSS

本文链接：https://blog.csdn.net/qq_39301366/article/details/81415611

版权

CSS 专栏收录该内容

12 篇文章 0 订阅

订阅专栏

CSS样式规则：
CSS规则由两部分构成：选择器（告诉浏览器给谁设置样式），声明（每个声明由属性和值构成由分号隔开位于大括号内）
CSS注释：/* */
例：h1{color:red;font-size:14px;}
相同属性和值的选择器可以重叠：h1，h2，p{color:red;font-size:14px;}

CSS使用方法，如何引用CSS样式
1.行内样式（内联样式）
在开始标签内添加style样式属性
例如：<p style="color:red;font-size:20px;">内容</p >
缺点:长度冗余，不便于后期维护，不建议大量使用

2.内部样式表（嵌入样式）
把css样式写在：
<style type="text/css">
h1{color:red;font-size:14px;}
CSS样式...
</style>
样式写好后，要放在<head></head>标签内。
对于低版本浏览器不识别style，要用包裹：

3.外部样式表
把CSS样式代码写在独立的一个文件中，开发中经常使用
页面加载时，同时加载CSS样式
扩展名：CSS文件名.CSS
引入外部文件：
<head>
<link href="XX.css" rel="stylesheet" type="text/css" />
</head>
其中XX.css文件中：
h1{color:red;font-size:14px;}
p{color:red;font-size:14px;}
等等诸如此类的代码

4.导入式
@import“外部CSS样式”
把CSS样式代码写在独立的一个文件中，在读取完HTML文件之后加载
或者 @import url(XX.css);
说明：@import要写在<style>标签内最开始
例如：
<head>
<style type="text/css">
@import url(css.css);
</style>
</head>
总结：
使用链入外部样式的好处
1.CSS和HTML分离
2.多个文件可以使用同一个样式文件
3.多文件引用同一个css文件，css只需下载一次

css使用方法优先级：
行内样式>内部样式>外部样式
注意：内部样式与链入外部样式的优先级取决于所处位置的先后，最后的定义优先级最高

风九儿

关注

2
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
CSS基本语法

CSS样式规则：CSS规则由两部分构成：选择器（告诉浏览器给谁设置样式），声明（每个声明由属性和值构成由分号隔开位于大括号内）CSS注释：/* */例：h1{color:red;font-size:14px;} 相同属性和值的选择器可以重叠：h1，h2，p{color:red;font-size:14px;}CSS使用方法，如何引用CSS样式1.行内样式（内联样式）在开...
复制链接

扫一扫

专栏目录