html-day06继承&文本溢出&元素类型
1.继承 【面试题】
概念:有上下级关系的元素之间,上级元素的样式被下级元素所拥有,这个现象就是继承。 文本相关的属性和列表相关的属性会被继承。 面试题:请列举15个会被继承的属性!
2.单行文本溢出显示省略号 【面试题】
1.设置宽度 width:*px; 2.强制不换行 white-space:nowrap; 3.设置溢出隐藏 overflow:hidden; 4.设置溢出的标识是省略号 text-overflow:ellipsis; 多行文本溢出显示省略号,用js实现。 white-space:nowrap不换行 | pre保留原格式 (pre-line | pre-wrap)| normal overflow:hidden隐藏 | auto自动调整是否出现滚动条 | scroll滚动条; text-overflow:ellipsis省略号 | clip切割;
3.元素类型及转换
常规分类: 块级元素:默认独占整行,可以设置宽高等 行级元素:有多宽占据多宽,不可以设置宽高、垂直方向的内外边距。 行内块元素:有多宽占据多宽,可以设置宽高等。 可变元素:了解 非主流分类: 置换元素:浏览器通过解析元素的属性和属性值,决定渲染什么样的效果。 input img button 非置换元素:除去置换的就是非置换。 元素类型的转换语法: display: inline 行级元素 | block块级元素 | inline-block行内块元素 | none 隐藏; 隐藏应用场景:类似button整块区域都可以点击跳转给 a 设置隐藏 让谁显示,鼠标就悬停在该元素的父级上
4层级选择器
e f{ } 选中e元素的后代f e > f{ } 选中e元素的子代f e,f{ } 选中e和f
5项目实战
第一步:建立项目英文名称的文件夹 qianfeng 第二步:项目文件夹里创建css文件夹、images文件夹(imgs)、index.html... 1、css文件夹 reset.css(重置样式表) | normalize.css 网络搜索reset.css | nomalize.css cdn cv下来 common.css(公共样式表) index.css(首页 与html文件名称一致) 2、imgs文件夹 3、index.html (首页) ... 第三步:link链接先reset后index