解决方法:可通过加入 CSS 属性 -webkt-text-size-adjust:none;解决
7)超链接访问过后 hover 样式就不出现了,被点击访问过的超链接样式不在具有 hover 和 active ;
解决方法:改变CSS属性的排列顺序:L-V-H-A: a:link{ } a:visited{ } a:hover{ } a:active{ }
11、如何实现浏览器内多个标签页之间的通信?
答案解析:
调用localstorge、cookies等本地存储方式
12、webSocket如何兼容低浏览器?
答案解析:
Adobe Flash Socket 、 ActiveX HTMLFile (IE) 、 基于 multipart 编码发送 XHR 、 基于长轮询的 XHR
13、支持HTML5新标签
答案解析:
1)IE8/IE7/IE6支持通过 document.createElement 方法产生的标签,可以利用这一特性让这些浏览器支持 HTML5 新标签,浏览器支持新标签后,还需要添加标签默认的样式;
2)当然最好的方式是直接使用成熟的框架、使用最多的是 html5shim 框架
14、如何区分:DOCTYPE 声明\新增的结构元素\功能元素,语义化的理解?
答案解析:
1)用正确的标签做正确的事情;
2)html语义化就是让页面的内容结构化,便于对浏览器、搜索引擎解析;
3)在没有样式 CSS 情况下也以一种文档格式显示,并且是容易阅读的;
4)搜索引擎的爬虫依赖于标记来确定上下文和各个关键字的权重,利用 SEO ;
5)使阅读源代码的人对网站更容易将网站分块,便于阅读维护理解。
15、介绍一下 CSS 的盒子模型?
答案解析:
1)有两种,IE 盒子模型、标准 W3C 盒子模型; IE 的 content 部分包含了 border 和 padding;
2)盒模型:内容(content)、填充(padding)、边界(margin)、边框(border)。
16、CSS 选择符有哪些?哪些属性可以继承?优先级算法如何计算? CSS3 新增伪类有哪些?
答案解析:
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)
17、可继承的样式: font-size font-family color, UL LI DL DD DT
18、不可继承的样式:border padding margin width height
19、优先级就近原则,同权重情况下样式定义最近者为准
20、载入样式以最后载入的定位为准;
解析答案:优先级为: !important > id > class > tag ; important 比 内联优先级高
21、CSS3新增伪类举例:
答案解析:
p:first-of-type 选择属于其父元素的首个
元素的每个
元素;
p:last-of-type 选择属于其父元素的最后
元素的每个
元素;
p:only-of-type 选择属于其父元素唯一的
元素的每个
元素;
p:only-child 选择属于其父元素的唯一子元素的每个
元素;
p:nth-child(2) 选择属于其父元素的第二个子元素的每个
元素;
:enabled :disabled 控制表单控件的禁用状态;
:checked 单选框或复选框被选中。
22、如何居中div? 如何居中一个浮动元素?
答案解析:
给div 设置一个宽度,然后添加 margin:0 auto 属性;div{width:200px; margin:0 auto; }
23、居中一个浮动元素
答案解析:
确定容器的宽高 宽500 高300的层,设置层的外边距
.div{width:500px;height:300px;margin:-150px 0 0 -250px;position:relative;background:green;left:50%;头:50%}
24、css3有哪些新特性?
答案解析:
CSS3 实现圆角(border-radius:8px;),阴影(box-shadow:10px),对文字加特效(text-shadow),线性渐变(gradient),旋转(transform)
transform:rotate(9deg) scale(0.85,0.90) translate(0px,-30px) skew(-9deg,0deg);//旋转,缩放,定位,倾斜
增加了更多的 css 选择器 多背景 rgba
25、为什么要初始化 CSS 样式
答案解析:
因为浏览器的兼容问题,不同浏览器对有些标签的默认值是不同的,如果没对 CSS 初始化往往会出现浏览器之间的页面显示差异。
当然,初始化样式会对 SEO 有一定的影响,但鱼和熊掌不可兼得,但力求影响最小的情况下初始化。
最简单的初始化方法是:*{padding:0;margin:0} (不建议)
淘宝的样式初始化:
body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input,
textarea, th, td { margin:0; padding:0; }
body, button, input, select, textarea { font:12px/1.5tahoma, arial, \5b8b\4f53; }
h1, h2, h3, h4, h5, h6{ font-size:100%; }
address, cite, dfn, em, var { font-style:normal; }
code, kbd, pre, samp { font-family:couriernew, courier, monospace; }
small{ font-size:12px; }
ul, ol { list-style:none; }
a { text-decoration:none; }
a:hover { text-decoration:underline; }
sup { vertical-align:text-top; }
sub{ vertical-align:text-bottom; }
legend { color:#000; }
fieldset, img { border:0; }
button, input, select, textarea { font-size:100%; } table { border-collapse:collapse; border-spacing:0; }
26、display:inline-block 什么时候会显示间隙?
答案解析:
移除空格,使用margin 负值、使用 font-size:0、letter-spacing 、word-spacing
27、使用 CSS 预处理器吗?喜欢哪个?
答案解析:SASS
**28、**什么是盒子模型?
答案解析:
在网页中,一个元素占有空间的大小由几个部分构成,其中包括元素的内容(content),元素的内边距(padding),元素的边框(border),元素的外边距(margin)四个部分。这四个部分占有的空间中,有的部分可以显示相应的内容,而有的部分只用来分隔相邻的区域或区域。4个部分一起构成了css中元素的盒模型。
29、CSS实现垂直水平居中
答案解析:
一道经典的问题,实现方法有很多种,以下是其中一种实现:
HTML结构:
CSS:
.wrapper{position:relative;}
.content{
background-color:#6699FF;
width:200px;
height:200px;
position: absolute; //父元素需要相对定位
top: 50%;
left: 50%;
margin-top:-100px ; //二分之一的height,width
margin-left: -100px;
}
30、简述一下src与href的区别
答案解析:
href 是指向网络资源所在位置,建立和当前元素(锚点)或当前文档(链接)之间的链接,用于超链接。
src是指向外部资源的位置,指向的内容将会嵌入到文档中当前标签所在位置;在请求src资源时会将其指向的资源下载并应用到文档内,例如js脚本,img图片和frame等元素。当浏览器解析到该元素时,会暂停其他资源的下载和处理,直到将该资源加载、编译、执行完毕,图片和框架等元素也如此,类似于将所指向资源嵌入当前标签内。这也是为什么将js脚本放在底部而不是头部。
31、简述同步和异步的区别
答案解析:
同步是阻塞模式,异步是非阻塞模式。
同步就是指一个进程在执行某个请求的时候,若该请求需要一段时间才能返回信息,那么这个进程将会一直等待下去,直到收到返回信息才继续执行下去;
异步是指进程不需要一直等下去,而是继续执行下面的操作,不管其他进程的状态。当有消息返回时系统会通知进程进行处理,这样可以提高执行的效率。
32、px和em的区别
最后
自我介绍一下,小编13年上海交大毕业,曾经在小公司待过,也去过华为、OPPO等大厂,18年进入阿里一直到现在。
深知大多数初中级Android工程师,想要提升技能,往往是自己摸索成长,自己不成体系的自学效果低效漫长且无助。
因此收集整理了一份《2024年Web前端开发全套学习资料》,初衷也很简单,就是希望能够帮助到想自学提升又不知道该从何学起的朋友,同时减轻大家的负担。
既有适合小白学习的零基础资料,也有适合3年以上经验的小伙伴深入学习提升的进阶课程,基本涵盖了95%以上Android开发知识点!不论你是刚入门Android开发的新手,还是希望在技术上不断提升的资深开发者,这些资料都将为你打开新的学习之门!
如果你觉得这些内容对你有帮助,需要这份全套学习资料的朋友可以戳我获取!!
由于文件比较大,这里只是将部分目录截图出来,每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频,并且会持续更新!
…(img-kHgpndhK-1715139760467)]
[外链图片转存中…(img-aoRku8Bp-1715139760467)]
既有适合小白学习的零基础资料,也有适合3年以上经验的小伙伴深入学习提升的进阶课程,基本涵盖了95%以上Android开发知识点!不论你是刚入门Android开发的新手,还是希望在技术上不断提升的资深开发者,这些资料都将为你打开新的学习之门!
如果你觉得这些内容对你有帮助,需要这份全套学习资料的朋友可以戳我获取!!
由于文件比较大,这里只是将部分目录截图出来,每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频,并且会持续更新!