前端编程课件01-HTML+CSS.pdf
01-HTML-CSS-常⻅⾯试题
1.HTML标签有哪些⾏内元素
a
img
picture
span
input
textarea
select
label
2.说说你对元素语义化的理解
元素语义化就是⽤正确的元素做正确的事情。虽然在理论上，所以的html元素都可以通过css样式实现
相同的事情，但是这么做会使事情复杂化，所以我们需要元素语义化来降低复杂度。
元素语义化在我们实际的开发中有很多好处，⽐如：
提⾼代码的阅读性和可维护性;
减少coder之间的沟通成本;
能让语⾳合成⼯具正确识别⽹⻚元素的⽤途，以便做出正确的反应
有利于SEO(SearchEngineOptimization)
3.HTML中有哪些语义化标签
header
footer
main
aside
article
section
address
summary/details
menu
h1/h2/h3/h4/h5/h6
img
p
strong/italic
4.什么是URL编码(URLEncode)
encodeURI⽤来编码URI，其不会编码保留字符。
encodeURIComponent⽤来编码URI参数，除了字符：A-Za-z0-9-_.!~*()，都将会转义。
5.说说你对SEO的理解
SEO就是搜索引擎优化(SearchEngineOptimization)，SEO通过了解搜索引擎的运⾏规则来调整⽹站，
以提⾼⽹站的曝光度,以及⽹站的排名。
Google搜索引擎的⼯作流程主要分为三个阶段：
抓取：Google会使⽤名为“抓取⼯具”的⾃动程序搜索⽹络，以查找新⽹⻚或更新后的⽹⻚。Google会
将这些⽹⻚的地址（即⽹址）存储在⼀个⼤型列表中，以便⽇后查看。我们会通过许多不同的⽅法查找
⽹⻚，但主要⽅法是跟踪我们已知的⽹⻚中的链接。
编⼊索引：Google会访问它通过抓取得知的⽹⻚，并会尝试分析每个⽹⻚的主题。Google会分析⽹⻚
中的内容、图⽚和视频⽂件，尝试了解⽹⻚的主题。这些信息存储在Google索引中，⽽Google索引
是⼀个存储在海量计算机中的巨⼤数据库。
呈现搜索结果：当⽤户在Google上进⾏搜索时，Google会尝试确定最优质的搜索结果。“最佳”结果取
决于许多因素，包括⽤户的位置、语⾔、设备（桌⾯设备或⼿机）以及先前⽤过的搜索查询。例如，在
⽤户搜索“⾃⾏⻋维修店”后，Google向巴黎⽤户显示的答案与向⾹港⽤户显示的答案有所不同。⽀付费
⽤不能提⾼⽹⻚在Google搜索结果中的排名，⽹⻚排名是完全依靠算法完成的。
6.+与~选择器有什么不同
~是匹配元素之后的选择器
+是匹配相邻元素选择器
template
div我是div/div
p我是p/p
p我是p/p
div我是div/div
p我是p/p
div
p我是div下⾯的p/p
p我是div下⾯的p/p
/div
span我是span/span
/template
style
div+p{
color:red;
}
/*第⼀个p标签变红⾊了*/
div~p{
color:red;
}
/*div后⾯的p标签都变成红⾊了*/
/style
7.说明text-align居中的条件
text-align:直接翻译过来设置⽂本的⽔平对⻬⽅式(是继承属性)(是继承属性)
text-align并不控制块元素⾃⼰的对⻬，只控制它的⾏内内容的对⻬
MDN解释:定义⾏内内容（例如⽂字）如何相对它的块⽗元素对⻬(可以设置图⽚居中)
W3C官⽅⽂档解释:设置⾏内(inline-level)元素(没有填满⽗元素)在快级⽗元素的对⻬⽅式
8.line-height为什么可以让⽂字垂直居中？
line-height:两⾏⽂字基线(baselin