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.通用选择器
通用选择器用”“号表示,他是所有选择器中作用范围最广的,能匹配页面中所有的元素,
语法:{}
3.class选择器
在样式表中写法都是以”.”开头,引用时为class=””
4.id选择器
id选择器使用”#”进行标识,引用时为id=””
例如:
样式表中 #a{样式}
引用时
© 版权声明
文章版权归作者所有,未经允许请勿转载。
THE END
喜欢就支持一下吧
相关推荐