1.块级元素和行内元素分别有哪些?动手测试并列出4条以上的特性区别
- 1.块级元素:div , p , form, ul, li , ol, dl, form, address, fieldset, hr, menu, table
- 2.行内元素:span, strong, em, br, img , input, label, select, textarea, cite
- 区别
- 块级元素占据整行,行内元素不占据整行,可以填充进一行时水平排开
2.块级元素内部可以包裹块级和行内元素,而行内元素内部只能包裹行内元素
3.块级元素默认宽度与浏览器宽度一样,与内容无关;行内元素宽度只与内容有关;
4.行内元素设置width,height无效(可以设置line-height)
margin上下无效左右有效,padding上下无效左右有效。
- 块级元素占据整行,行内元素不占据整行,可以填充进一行时水平排开
2.什么是 CSS 继承? 哪些属性能继承,哪些不能?
- css继承:设置父级元素,子元素的样式自动和父元素样式一致。有些属性支持继承有些不支持
- 可以继承属性:
字体属性
font、font-family:规定元素的字体系列、font-weight、font-size、font-style:定义字体的风格
文本系列属性:
text-indent:文本缩进、text-align:文本水平对齐、line-height:行高、word-spacing、letter-spacing、text-transform:控制文本大小写、direction:规定文本的书写方向
color:文本颜色
元素可见性:visibility
表格布局属性:caption-side、border-collapse、border-spacing、empty-cells、table-layout
列表布局属性:list-style-type、list-style-image、list-style-position、list-style
生成内容属性:quotes
光标属性:cursor
- 不可以继承属性:
display
文本类:
vertical-align:垂直文本对齐
text-decoration:规定添加到文本的装饰
text-shadow:文本阴影效果
white-space:空白符的处理
unicode-bidi:设置文本的方向
盒子模型的属性:width、height、margin 、margin-XXX、border、border-XXX、。。。基本都不行
背景属性:都不行
定位属性:float、clear、position、top、right、bottom、left、min-width、min-height、max-width、max-height、overflow、clip、z-index
声音样式属性
3.如何让块级元素水平居中?如何让行内元素水平居中?
元素类型 | 居中方法 |
---|---|
块级元素居中 | margin: 0 auto; |
行内元素居中 | text-align : center; |
4.单行文本溢出怎么办如何实现?
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
5.px em rem有什么区别?
- . px 像素px是相对于显示器屏幕分辨率而言的
- . em 相对于当前对象内文本的字体尺寸
- . rem 相对于HTML根元素尺寸大小
6.解释下面代码的作用?为什么要加引号? 字体里\5b8b\4f53代表什么?
body{
font: 12px/1.5 tahoma,arial,'Hiragino Sans GB','\5b8b\4f53',sans-serif;
}
设定字体大小和字体类型,因为有space如果没有引号,会按照两个元素处理
数字和字母代表unicode-对应宋体字体和微软雅黑字体
编码类题目:
1.效果1
2.效果2
3.效果3
4.关于画三角形
5.效果5
网友评论