好程序员HTML5大前端分享web前端面试题集锦三

news/2024/7/19 11:09:29 标签: 前端, 爬虫

为什么80%的码农都做不了架构师?>>>   hot3.png

1、HTML语义化的理解?

答案:HTML语义化就是让页面的内容结构化,便于对浏览器、搜索引擎解析;在没有样式CSS的情况下也以一种文档格式显示,并且是容易阅读的;搜索引擎的爬虫依赖于标记来确定上下文和各个关键字的权重,利于SEO;使阅读源代码的人对网站更容易将网站分块,便于阅读维护理解。

2、父元素透明,但是又不影响子元素的透明度怎么实现?

答案:方法一:用rgba

方法二:再加上一层与父元素同级的div装载子元素,定位到子元素原来的位置

3、对web标准以及w3c的理解与认识?

答案:web标准就是将页面的结构、表现和行为各自独立实现,w3c对标注提出了规范化的要求

对结构的要求:(标签规范可以提高搜索引擎对页面的抓取效率,对SEO很有帮助)

标签字母要小写;标签要闭合;标签不允许随意嵌套

对css和js的要求:

尽量使用外联css样式表和js脚本,使结构、表现、行为相分离,符合规范,同时提高页面渲染速度,提高用户体验;

样式尽量少用行间样式表,使结构与表现分离,标签的id和class命名要做到见文知义,标签越少,加载越快,用户体验更高,代码维护更简单,便于改版;

不需要变动页面内容,便可提供打印版本而不需要复制内容,提高网站易用性

4、display none visibility hidden区别?

答案:display:none是彻底消失,不在文档流中占位,浏览器也不会解析该元素;visibility:hidden是视觉上消失了,可以理解为透明度为0的效果,在文档流中占位,浏览器会解析该元素;

使用visibility:hidden比display:none性能上要好,display:none切换显示时visibility,页面产生回流(当页面中的一部分元素需要改变规模尺寸、布局、显示隐藏等,页面重新构建,此时就是回流。所有页面第一次加载时需要产生一次回流),而visibility切换是否显示时则不会引起回流。

5、Px、em、rem的区别

答案:相同点:px、em和rem都是长度单位;

异同点:px的值是固定的,指定是多少就是多少,计算比较容易。em得值不是固定的,并且em会继承父级元素的字体大小。Rem是根据跟标签HTML的字体大小计算的

浏览器的默认字体高都是16px。所以未经调整的浏览器都符合: 1em=1rem=16p

那么12px=0.75em=0.75rem, 10px=0.625em=0.625rem。

转载于:https://my.oschina.net/530504/blog/3057837


http://www.niftyadmin.cn/n/733687.html

相关文章

express 使用 vue-router 的 history 踩坑

history 是什么? 官方说法 vue-router 默认 hash 模式 —— 使用 URL 的 hash 来模拟一个完整的 URL,于是当 URL 改变时,页面不会重新加载。 如果不想要很丑的 hash,我们可以用路由的 history 模式,这种模式充分利用 h…

LWN:Ardruino的IoT设备可以轻松用上TLS了!

关注了就能看到更多这么棒的文章哦~TLS gets a boost from Arduino for IoT devicesBy John CoggeshallJuly 28, 2020https://lwn.net/Articles/826757/DeepL assisted translationArduino 设备是 do-it-yourself(DIY)爱好者用于创建物联网&a…

CSS 多行省略失效 (-webkit-box-orient 失效)

背景scss文件中,设置多行省略(如下),代码未生效overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;复制代码现象代码未生效:查看style,-webkit-box…

LWN:5.8内核数据分析!

关注了就能看到更多这么棒的文章哦~Some statistics from the 5.8 kernel cycleBy Jonathan CorbetAugust 3, 20208月2日,Linus Torvalds宣布了5.8 kernel正式发布。标志着9周的开发周期的结束。这期间,有16,306个changeset合入了mainline&am…

Kubernetes集群容器运行日志收集

参考文档 https://yq.aliyun.com/articles/679721 https://www.cnblogs.com/keithtt/p/6410249.html https://github.com/kiwigrid/helm-charts/tree/master/charts/fluentd-elasticsearch https://github.com/kubernetes/kubernetes/tree/5d9d5bca796774a2c12d4e4443e684b619c…

LWN:netgpu的故事,说明了proprietary kernel module会带来什么损害!

关注了就能看到更多这么棒的文章哦~Netgpu and the hazards of proprietary kernel modulesBy Jonathan CorbetJuly 31, 2020https://lwn.net/Articles/827596/表面上来看,netgpu patch set 增加了一个有价值的新功能:可以在网卡和 GPU 之间直…

Activiti工作流从入门到入土:入门实例

文章源码托管:github.com/OUYANGSIHAI… 欢迎 star !!! 一、前言 在上一节中我们对activiti进行了基本的介绍activiti进行了基本的介绍,同时介绍了基本的概念。 这一节,我将用一个入门程序,介绍…

LWN:重构GNOME古老的无障碍访问功能!

关注了就能看到更多这么棒的文章哦~The archaeology of GNOME accessibilityBy Jonathan CorbetJuly 23, 2020GUADEChttps://lwn.net/Articles/826738/DeepL assisted translation.世界上有很多人需要依赖某种无障碍支持(accessibility support&#xff…