CSS知识点总结(四)
一、伪类和伪元素的区别?
- 伪类:用于元素处于某种状态时,为其添加的样式
- 伪元素:用于创建一些不在DOM树中的元素,并为其添加样式。
二、CSS权重汇总
权重 | 选择器 |
---|---|
0000 | 继承的样式、通用选择器(*)、后代选择器、子代选择器(>)、兄弟选择器(~,+) |
0001 | 标签选择器、伪元素选择器(::before, ::after) |
0010 | 类选择器,伪类选择器(:hover, :nth-child())、属性选择器[title] |
0100 | id选择器 |
1000 | 内联样式 |
∞ | !important |
三、可继承的CSS属性
1.字体属性系列
font:组合字体
font-family:规定元素的字体系列
font-weight:设置字体的粗细
font-size:设置字体的尺寸
font-style:定义字体的风格
font-variant:设置小型大写字母的字体显示文本,这意味着所有的小写字母均会被转换为大写,但是所有使用小型大写字体的字母与其余文本相比,其字体尺寸更小。
font-stretch:对当前的 font-family 进行伸缩变形。所有主流浏览器都不支持。
font-size-adjust:为某个元素规定一个 aspect 值,这样就可以保持首选字体的 x-height。
2.文本属性系列
text-indent:文本缩进
text-align:文本水平对齐
line-height:行高
word-spacing:增加或减少单词间的空白(即字间隔)
letter-spacing:增加或减少字符间的空白(字符间距)
text-transform:控制文本大小写
direction:规定文本的书写方向
color:文本颜色
3、元素可见性:visibility
4、表格布局属性:caption-side、border-collapse、border-spacing、empty-cells、table-layout
5、列表布局属性:list-style-type、list-style-image、list-style-position、list-style
6、生成内容属性:quotes
7、光标属性:cursor
8、页面样式属性:page、page-break-inside、windows、orphans
9、声音样式属性:speak、speak-punctuation、speak-numeral、speak-header、speech-rate、volume、voice-family、pitch、pitch-range、stress、richness、、azimuth、elevation
四、画出一条0.5px的线
.hr {
margin-top: 50px;
height: 1px;
transform: scaleY(0.5);
transform-origin: 50% 100%;
background-color: black;
}
五、行内元素的margin和padding生效吗?
对于行内元素来说可以设置margin和padding,但是只有左右方向的会对其他元素有影响。
六、CSS选择器的效率
我们都知道CSS具有层叠性,继承性和优先级三大特性。
CSS的选择器也有效率的问题,常见的选择器效率排序为:
- ID选择器
- 类选择器
- 标签选择器
- 兄弟选择器(如 p + a, p ~ a)
- 子代选择器(li > p)
- 后代选择器(li a)
- 通配符选择器(*)
- 属性选择器(
a[rel="external"]
) - 伪类选择器(
a:hover,li:nth-child
)
可以看出ID选择器和类选择器的效率很高,伪类选择器和属性选择器权重虽然和类选择器一样大,但是效率却很低。
七、超链接被点击访问过后,hover和active将不再起作用,下列哪种CSS属性的排列顺序能解决这个问题
a:link{ }
a:visited{ }
a:hover{ }
a:active{ }
L-V-H-A
八、JS中异常
throw抛出异常信息
throws声明可能出现的异常
九、getElementsByName()
返回对拥有指定name值的对象的引用
返回的是一组对象
十、jQuery 事件 - select() 方法
当 textarea 或文本类型的 input 元素中的文本被选择时,会发生 select 事件。
十一、数据库ER图
ER图分为实体、属性、关系三个核心部分
长方形,椭圆形,菱形
十二、对含有31个元素的序列采用直接选择排序算法排序,在最坏情况下需要进行多少次移动才能完成排序
3(n - 1) = 90