CSS初识

CSS（Cascading Style Sheets）即层叠样式表，适用于（增强）控制网页样式并允许将样式信息与网页内容分离的一种标记性语言。CSS样式极大地提高了工作效率。

一.引入CSS样式表

1.内部样式表（内嵌式）

内嵌式是将CSS代码集中写在HTML文档的head头部标签中，并且用style标签定义。语法中，style标签一般位于head标签中title标签之后，也可以把它放在HTML文档中的任何地方。

例如：<head>
         <style=" ">
         选择器{属性1：属性值1；属性2：属性值2；}
         </style>
      </head>
      
复制代码

2.行内式（内联样式）

内联样式又称行内式，是通过标签的style属性来设置元素的样式。
<标签名 style=”样式名1：样式值1；样式名2：样式值2；”></标签名>

3.外部样式表（外链式）

外部样式是将所有的样式放在一个或多个以.css为扩展名的外部样式表文件中，通过link标签将外部样式表文件链接到HTML文档中。

例如：<head>
        <link href="https://juejin.cn/post/CSS文件的路径"  rel="stylesheet"  type="text/css">
      </head>
注意： link是个单标签！
       href：定义所链接外部样式表文件的URL，可以是相对路径，也可以是绝对路径 
       type：定义所链接的文档类型，在这里需指定为："text/css",表示链接的外部文件为CSS样式表。
       rel：定义所链接的外部文档与被链接文档之间的关系，在这里需要指定为"stylesheet",表示被链接的文档是一个样式表文件
复制代码

4. 外部导入式

在标签内使用@import关键字导入外部样式表文件

例如:<style type="text/css">
     @import url("url地址");
     </style>
复制代码

二. CSS选择器

1.标签选择器

语法：标签选择器名{属性：属性值；}
例如：body{}、p{}、div{}、table{}….

2.通用选择器

通用选择器用”“号表示，他是所有选择器中作用范围最广的，能匹配页面中所有的元素，
语法：{}

通用选择器.jpg

3.class选择器

在样式表中写法都是以”.”开头，引用时为class=””

class选择器jpg.jpg

4.id选择器

id选择器使用”#”进行标识,引用时为id=””
例如：
样式表中 #a{样式}
引用时

文章版权归作者所有，未经允许请勿转载。

THE END

后端

喜欢就支持一下吧

Python 模块和包

等保测评2.0：Oracle身份鉴别（上）

Cisco Prime Central for Hosted Collaboration Solution OpenView web菜单跨站脚本漏洞

Vue学习笔记整理

Frequently Asked Questions：为什么类型不实现Equal接口呢?

搭建ELK日志监控分析平台

CSS样式总结笔记