css3(1)
程序员文章站
2022-05-11 09:14:03
...
- CSS选择器以及引入方式哪几种，CSS选择器有哪些以及它们的优先级
答案：行内样式<p style=”color:red;”>hello</p>,
内嵌式<head><meta charset=”utf-8”><title></title><style>p{color:red;}</style></head>
链接式，<link href=”../demo.css” rel=”stylesheet”type=”text/css”>
导入式，<style type=”text/css”>@import”../demo.css;”</style>
有缺陷把body里面的内容全部加载之后才去加载css
行内元素优先级最高，！Important指定样式规则应用最优先。
id选择器，类选择器，标签选择器，
优先级：id>class>标签 权重 - Body #d1:空格是在body的下面的一个选择器#d1
.c1,.c2:c1和c2:
Html和css混在一起写，耦合度比较高,我们要讲究低耦合和高内聚
三种样式用来设置同一个属性，遵循就近原则。
行内样式 内嵌式 链接式 - Css继承，继承上一级的属性，并不是所有的属性都能继承，只有字体相关的属性才能被继承。
Text-indent:20px; 文本缩进。 - Text-decoration:underline;
Text-decoration:none;
Text-decoration:line-through;
Text-decoration:overline; - text-transform:capitalize /单词首字母大写/
text-transform:uppercase /全部大写/
text-transform:lowercase /全部小写/ - Font-weight:600;
Letter-sapcing:10px; 文字之间的间距。
Border:solid 1px red;实线
Border:dashed 1px red;虚线
Border:dotted 1px red;细点点
字体居中：text-align:center;
line-height:盒子宽度;
Border-top:dashed 1px red;
Border-top-width:10px;
Border-top-style:dotted; - Background-color:red;
Background-image:url(“ “);
Background-repeat:no-repeat;
Background-repeat:repeat-y;
Background-position:10px 30px; 第一个值是块的左边，第二个值是块的上边
Background-attachment:fixed;背景图片固定
Background:blue url(“1.jpg”) no-repeat fixed 5px 10px;
Background:url(“1.jpg”);
Background:rgba(12,223,21,0.5);
Background:rgba(12,223,21,.5); - 精灵图：如何使用精灵图
1，测量图片的大小
2，测量图片左上角距离左边上边的距离
#d1{
width:18px;
height:18px;
background-image:url("../img/1.jpg");
background-position:-57px -70px;
}
Background-position:-50px -70px; 左边和上边都用负数。上一篇： css3小知识1
下一篇： shell脚本的常用命令