网站开发语言开发,沈阳网络科技公司排名,做词云的在线网站,楼盘 东莞网站建设上一章:HTML5、CSS3面试题#xff08;一#xff09;
哪些是块级元素那些是行内元素#xff0c;各有什么特点 #xff1f;#xff08;必会#xff09; 行内元素: a、span、b、img、strong、input、select、lable、em、button、textarea 、selecting 块级元素#xff1…上一章:HTML5、CSS3面试题一
哪些是块级元素那些是行内元素各有什么特点 必会 行内元素: a、span、b、img、strong、input、select、lable、em、button、textarea 、selecting 块级元素div、ul、li、dl、dt、dd、p、h1-h6、blockquote、form 行内、块级元素区别 1、块级元素会独占一行其宽度自动填满其父元素宽度行内元素不会独占一行相邻的行 内元素会排列在同一行里知道一行排不下才会换行其宽度随元素的内容而变化 2、一般情况下块级元素可以设置 width,height 属性行内元素设置 width, height 无效 (注意块级元素即使设置了宽度仍然是独占一行的) 3、块级元素可以设置 margin 和 padding 行内元素的水平方向的 padding-left,padding-right,margin-left,margin-right 都产生边距效果但是竖直方向的 padding-top,padding-bottom,margin-top,margin-bottom 都不会产生边距效果。水平方向有效 竖直方向无效 CSS 中选择器的优先级以及 CSS 权重如何计算必会 Important行内样式ID 选择器类选择器标签通配符继承浏览器默认属性 权重 CSS 权重是由四个数值决定看一张图比较好解释 第一等内联样式如stylecolor:red;权值为 1000.该方法会造成 css 难以管理 所以不推荐使用 第二等ID 选择器如#header权值为 0100 第三等类、伪类、属性选择器如.bar 权值为 0010 第四等标签、伪元素选择器如div ::first-line 权值为 0001 最后把这些值加起来再就是当前元素的权重了 其他 无条件优先的属性只需要在属性后面使用!important。它会覆盖页面内任何位置定义的元素样式。 ie6 支持上有些 bug 通配符子选择器相邻选择器等。如*,, 权值为 0000. 继承的样式没有权值 CSS 权重计算方式 计算选择符中的 ID 选择器的数量a 计算选择符中类、属性和伪类选择器的数量b 第 34 页 共 348 页 计算选择符中标签和伪元素选择器的数量c 忽略全局选择器 在分别计算 a、b、c 的值后按顺序连接 abc 三个数字组成一个新的数字改值即为所计算的选 择符的权重。如果两个选择符的计算权重值相同则采取“就近原则”。 示例 div#app.child[nameappName] /a1,b2,c1 —权重 1 100 10 10 121/ 12、CSS 选择器有哪些?哪些属性可以继承?必会 CSS 选择器 1、id 选择器 # myid 2、类选择器.myclassname 3、标签选择器div, h1, p 4、相邻选择器h1 p 5、子选择器ul li 6、后代选择器li a 7、通配符选择器 * 8、属性选择器a[rel external] 9、伪类选择器a:hover, li:nth-child 继承问题 可继承的样式 font-size font-family color, UL LI DL DD DT; 不可继承的样式border padding margin width height ; HTML5 的离线存储怎么使用工作原理是什么必会 在用户没有与因特网连接时可以正常访问站点或应用在用户与因特网连接时更新用 户机器上的缓存文件 原理 HTML5 的离线存储是基于一个新建的.appcache 文件的缓存机制(不是存储技术) 通过这个文件上的解析清单离线存储资源这些资源就会像 cookie 一样被存储了下来。之 后当网络在处于离线状态下时浏览器会通过被离线存储的数据进行页面展示 如何使用 1、页面头部像下面一样加入一个 manifest 的属性 2、在 cache.manifest 文件的编写离线存储的资源 3、在离线状态时操作 window.applicationCache 进行需求实现 说说你对语义化的理解列举 5 个语义化的标签必 会 1、去掉或样式丢失的时候能让页面呈现清晰的结构HTML 本身是没有表现的我们看到 例如h1是粗体字体大小 2em加粗strong是加粗的不要认为这是 HTML 的表现这些其实 HTML 默认的 CSS 样式在起作用所以去掉或样式丢失的时候能让 页面呈现清晰的结构不是语义化的 HTML 结构的优点但是浏览器都有有默认样式默 认样式的目的也是为了更好的表达 HTML 的语义可以说浏览器的默认样式和语义化的 HTML 结 构是不可分割的 2、屏幕阅读器如果访客有视障会完全根据你的标记来“读”你的网页 3、PDA、手机等设备可能无法像普通电脑的浏览器一样来渲染网页通常是因为这些设备 对 CSS 的支持较弱 4、有利于 SEO和搜索引擎建立良好沟通有助于爬虫抓取更多的有效信息爬虫依赖于 标签来确定上下文和各个关键字的权重 5、便于团队开发和维护语义化更具可读性是下一步吧网页的重要动向遵循 W3C 标 准的团队都遵循这个标准可以减少差异化 常见的语义化标签 header元素描述了文档的头部区域标签定义导航链接的部分 section 标签定义文档中的节section、区段。比如章节、页眉、页脚或文档中的其 他部分 article 标签定义独立的内容 aside 标签定义页面主区域内容之外的内容比如侧边栏 footer 元素描述了文档的底部区域 列举 5 个以上的 H5 事件必会 H5 事件 onblur当失去焦点时运行脚本 onchange当元素改变时运行脚本 onclick当单击鼠标时运行脚本 ondrop当被拖动元素正在被拖放时运行脚本 onended当媒体已抵达结尾时运行脚本 onerror当在元素加载期间发生错误时运行脚本 onfocus当获得焦点时运行脚本 oninput当元素获得用户输入时运行脚本 onkeydown当按下按键时运行脚本还没松开时就触发 onkeypress当按下按键时运行脚本还没松开时就触发 onkeyup当松开按键时运行脚本松开时即触发 onload当加载时运行脚本 onmousedown 当按下鼠标按钮时运行脚本 onmousemove当鼠标指针移动时运行脚本 onmouseout当鼠标指针移出元素时运行脚本 onmouseover当鼠标指针移至元素之上时运行脚本 onmouseup当松开鼠标按钮时运行脚本 CSS 单位中 px、em 和 rem 的区别必会 1、px 像素Pixel。绝对单位。像素 px 是相对于显示器屏幕分辨率而言的是一 个虚拟长度单位是计算机系统的数字化图像长度单位 2、em 是相对长度单位相对于当前对象内文本的字体尺寸。如当前对行内文本的字 体尺寸未被人为设置则相对于浏览器的默认字体尺寸。它会继承父级元素的字体大 小因此并不是一个固定的值 3、rem 是 CSS3 新增的一个相对单位root em根 em使用 rem 为元素设定字 体大小时仍然是相对大小但相对的只是 HTML 根元素 4、区别 IE 无法调整那些使用 px 作为单位的字体大小而 em 和 rem 可以缩放rem 相对的只是 HTML 根元素。这个单位可谓集相对大小和绝对大小的优点于一身通 过它既可以做到只修改根元素就成比例地调整所有字体大小又可以避免字体大小逐 层复合的连锁反应。目前除了 IE8 及更早版本外所有浏览器均已支持 rem
