好程序员web前端学习路线分享前端基础面试题-程序员宅基地

技术标签: web前端  CSS  好程序员  HTML5  web前端培训  面试题  

好程序员web前端学习路线分享前端基础面试题,希望对大家有所帮助。

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。

 

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/qq_35970166/article/details/100668830

智能推荐

DR模式LVS负载均衡实战部署_lvs dr 搭建负载均衡实战-程序员宅基地

文章浏览阅读120次。目录 一、LVS-DR工作原理1、数据包流向分析2、DR模式的特点 二、LVS-DR中的ARP问题三、LVS负载均衡DR模式群集部署1、部署共享存储2、配置节点服务器3、配置负载调度器4、测试验证 一、LVS-DR工作原理 1、数据包流向分析 第一步:客户端发送请求到 Director Server (负载均衡器),请求的数据报文到达内核空间。 数据报文 源 IP ------客户端的 IP目标 IP ------ VIP源 MAC ------客户端的 MAC目的 .._lvs dr 搭建负载均衡实战

vue.js用cdn引入_vue-danmaku cnd引入-程序员宅基地

文章浏览阅读893次。<!DOCTYPE html><html lang="en"><head> <title></title> <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/vue.js"></script><!-- 引入样式 --><link rel="stylesheet" href="https://unpkg.com/element-_vue-danmaku cnd引入

中国IT技术人员,是否适合新加坡发展-程序员宅基地

文章浏览阅读963次。友情提醒,本文彻头彻尾都是广告,如果不能接受,非常抱歉,烦请关闭本页。嗯,其实是两份广告,第一份是我自己的。前段时间有人说,知乎live是个红利期,其实我看到了,但是,唉..._新加坡it人员回国有没有优势

联想高志国:超融合已进入2.0时代_高志国 2018-程序员宅基地

文章浏览阅读872次。超融合2.0时代真的来了吗?超融合迈进2.0时代早在,2017年9月,联想在发布新一代超融合产品——H1000高级版、H3000企业版和H3000标准版的同时提出,超融合正在步入以“应用智能感知”为核心的2.0时代。联想是从用户应用需求的变化,以及超融合技术和架构自身演进的角度提出的超融合2.0的概念,其核心思想是以自主可控、弹性、可定制化的应用感知模式取代传统的技术架构,_高志国 2018

SVN遇到None of the targets are working copies的正确处理方式-程序员宅基地

文章浏览阅读2.5w次。有可能有人会问我为什么还在使用svn而不是git,从现状来讲git毫无疑问是当下的翘楚,但是并不是每个公司都会顺应时代潮流,svn就是是我们公司成为了首选的版本控制工具,既来之则安之! 回到主题吧,就在我开发的过程中,一次偶然的操作导致了提交与更新都无法成功。每次得到的结果都是None of the targets are working copies!立马我想到的就是谷歌,但..._none of the targets are working copies

WPS插件开发流程(1)-程序员宅基地

文章浏览阅读3.4w次,点赞22次,收藏106次。OneKey_Lite是一款由 @只为设计 独立开发的WPS演示免费插件。在开发过程中,感恩于网上那些无私分享代码的陌生人,给我这个开发小白提供了重要的借鉴参考。于是我决定把用C#和Visual Studio开发WPS插件的每一个具体步骤分享出来,让免费分享精神继续传递下去,希望对需要的朋友提供一些帮助。(一)开发前准备1. 操作系统在Win10系统中引用WPS的dll文件可能会受到系统权限限制的..._wps插件开发

随便推点

前端开源实战项目,大厂级别_前端工程师app软件项目-程序员宅基地

文章浏览阅读2.5k次,点赞2次,收藏27次。强烈推荐 G..._前端工程师app软件项目

关联规则可视化python语言_患者信息可视化及关联规则可视化-程序员宅基地

文章浏览阅读821次。源码链接:https://github.com/yemahei/test患者信息可视化及关联规则可视化系统的实现一、系统需求分析藏医药学是我国传统民族医药学宝库中一颗璀璨的明珠,在藏族人民漫长的生产、生活实践中,其系统的理论和独特的临床疗效及用药特色,为藏族人们繁衍生息、保障生命健康做出了重要贡献,也越来越受到世人的关注。由于平时藏医院患者数量庞大,会产生大量的病人信息,由于信息都是表格或者是其它..._关联规则可视化python语言_关联规则可视化

深度学习系列资料总结_cellpose 2.0-程序员宅基地

文章浏览阅读2.2w次,点赞126次,收藏467次。说明本系列深度学习资料集合包含机器学习、深度学习等各系列教程,主要以计算机视觉资料为主,包括图像识别、分类、检测、分割等,内容参考Github及网络资源,仅供个人学习。深度学习定义一般是指通过训练多层网络结构对未知数据进行分类或回归深度学习分类有监督学习方法——深度前馈网络、卷积神经网络、循环神经网络等;无监督学习方法——深度信念网、深度玻尔兹曼机,深度自编码器等。手写机器学习笔记github机器学习算法公式推导以及numpy实现github人工智能相关术语link。.................._cellpose 2.0

GitHub好玩有趣的开源项目_有没有开源的网页fps游戏-程序员宅基地

文章浏览阅读2.6k次。有些地址已经失效:访问目录地址https://github.com/Wechat-ggGitHub/Awesome-GitHub-Repohttps://github.com/Wechat-ggGitHub/Awesome-GitHub-Repo 好玩项目 摸鱼神器 宝藏项目 开源游戏 实战项目 前后端分离项目 毕业设计实战项目 高仿 App 项目 Vue 实战项目 小程序实战项目 Spring Boot 实战项目 管理系统 ._有没有开源的网页fps游戏

Junit 入门使用教程_junitgenerator怎么用-程序员宅基地

文章浏览阅读1.8k次,点赞5次,收藏25次。&#13; 1、Junit 是什么?&#13;  JUnit是一个Java语言的单元测试框架。它由Kent Beck和Erich Gamma建立,逐渐成为源于Kent Beck的sUnit的xUnit家族中最为成功的一个JUnit有它自己的JUnit扩展生态圈。多数Java的开发环境都已经集成了JUnit作为单元测试的工具。&#13;  注意:Junit 测试也是程序员测..._junitgenerator怎么用

基于arduino和openmv的智能小车设计制作流程_arduino和openmv跟随小车-程序员宅基地

文章浏览阅读4k次,点赞9次,收藏43次。arduino与openmv的智能物流小车一、购买模块组件准备阶段1、ArduinoMAGE2560+扩展板使用这个当做主控板,加上扩展板已经满足了所有需求,主要是也很便宜,唯一不足的是就是扩展板装上的时候,扩展板的电源接口的引脚有时候会与MAGE2560 的数据接口碰上,导致板子短路,当初因为这个换了好几块板子。2、openmvopenmv主要是用来扫码和识别物料颜色,我用的型号是openmv4 H7,识别很灵敏,但是换不同场景识别物料的时候一定要记得调节物料颜色阈值,不然有时候会识别不到。3_arduino和openmv跟随小车