发表于： 2019-11-17 22:33:21
1 786
今日完成：
深度思考：
深度思考
这些概念和理论上的东西，通常是面试中经常会被问到的问题。而且，理论体系掌握的很牢固，对于你的技术增长来说非常有帮助。
1.position定位有哪几种？各有什么特点
一、常见/用的四种
1.static
positon定位的默认值，没有定位
2.relative
生成相对定位的元素，相对于其正常位置进行定位，一般在子元素设置absoute定位时，给父元素设置relative
元素的位置通过top、right、bottom、left 控制，其值的定位起点都是是父元素左上角(这点和absoute、fixed不一样)
3.absoute
生成绝对定位的元素，相对于 static 定位以外的第一个父元素进行定位
元素的位置通过top、right、bottom、left 控制，top、left的定位起点是包含块左上角，right、bottom的定位起点是包含块右下角
4.fixed （ie6不兼容）
生成绝对定位的元素，相对于浏览器窗口进行定位，和absoute的区别是fixed不会跟随屏幕滚动(常见的各种贴屏广告)
元素的位置通过top、right、bottom、left 控制，top、left的定位起点是包含块左上角，right、bottom的定位起点是包含块右下角
2.哪些css属性可以设置百分比，其计算原则是什么？
可以使用百分比的样式属性:
定位：top,right,bottom,left;
盒模型：height,width,margin,padding,
背景：background-position,background-size(css3),
文本：text-indent，
字体：font-size;
各个属性使用详细：
top,right,bottom,left:全兼容,
height：基于包含它的块级对象的百分比高度。
width：基于包含它的块级对象的百分比宽度。
margin：百分数是相对于父元素的 width 计算的。
padding：百分数是相对于父元素的 width 计算的。
3.常见的表单元素有哪些？各有什么属性？
常用表单元素
form:定义供用户输入的表单。
fieldset:定义域。即输入区加有文字的边框。
legend：定义域的标题，即边框上的文字。
label：定义一个控制的标签。如输入框前的文字，用以关联用户的选择。
input:定义输入域，常用。可设置type属性，从而具有不同功能。
textarea:定义文本域(一个多行的输入控件)，默认可通过鼠标拖动调整大小。
button:定义一个按钮。
select:定义一个选择列表，即下拉列表。
option:定义下拉列表中的选项。
form元素：
method属性：规定用于发送 form-data 的 HTTP 方法。实际上就是请求的方式。
name属性：表单的名称。
action属性：指定表单请求的路径
target属性：指定action的Url在哪里打开
input元素:
1.单行文本框:指定input标签内的type属性值为text
2.密码输入框:指定input标签内的type属性值为password
3.隐藏域:指定input标签内的type属性值为hidden
4.单选框:指定input标签内的type属性值为radio
5.复选框:指定input标签内的type属性值为checkbox
6.图像域:指定input标签内的type属性值为image,可指定width(宽)和height(高)属性,可用于提交表单
7.文件上传域:指定input标签内的type属性值为file
8.提交,重置,普通按钮:指定input标签内的type属性值为submit,reset,button
9.checked:设置单选,复选框初始状态是否处于选中状态,(checked="checked")
10. disabled设置首次加载时禁用此元素.隐藏域不可使用
11. maxlength:设置文本框中允许输入的最大字符数
12.size:指定元素的长度;不用于隐藏域
13.src:用于图片域
4.如何理解HTML结构的语义化？
为什么要语义化？
1.去掉或样式丢失的时候能让页面呈现清晰的结构：
html本身是没有表现的，我们看到例如<h1>是粗体，字体大小2em，加粗；<strong>是加粗的，不要认为这是html的表现，这些其实html默认的css样式在起作用，所以去掉或样式丢失的时候能让页面呈现清晰的结构不是语义化的HTML结构的优点，但是浏览器都有有默认样式，默认样式的目的也是为了更好的表达html的语义，可以说浏览器的默认样式和语义化的HTML结构是不可分割的。
2.屏幕阅读器（如果访客有视障）会完全根据你的标记来“读”你的网页.
例如,如果你使用的含语义的标记,屏幕阅读器就会“逐个拼出”你的单词,而不是试着去对它完整发音.
3.PDA、手机等设备可能无法像普通电脑的浏览器一样来渲染网页（通常是因为这些设备对CSS的支持较弱）.
使用语义标记可以确保这些设备以一种有意义的方式来渲染网页.理想情况下,观看设备的任务是符合设备本身的条件来渲染网页.
语义标记为设备提供了所需的相关信息,就省去了你自己去考虑所有可能的显示情况（包括现有的或者将来新的设备）.例如,一部手机可以选择使一段标记了标题的文字以粗体显示.而掌上电脑可能会以比较大的字体来显示.无论哪种方式一旦你对文本标记为标题,您就可以确信读取设备将根据其自身的条件来合适地显示页面.
4.搜索引擎的爬虫也依赖于标记来确定上下文和各个关键字的权重.
过去你可能还没有考虑搜索引擎的爬虫也是网站的“访客”,但现在它们他们实际上是极其宝贵的用户.没有他们的话,搜索引擎将无法索引你的网站,然后一般用户将很难过来访问.
5.你的页面是否对爬虫容易理解非常重要,因为爬虫很大程度上会忽略用于表现的标记,而只注重语义标记.
因此,如果页面文件的标题被标记,而不是,那么这个页面在搜索结果的位置可能会比较靠后.除了提升易用性外,语义标记有利于正确使用CSS和JavaScript,因为其本身提供了许多“钩钩”来应用页面的样式与行为.SEO主要还是靠你网站的内容和外部链接的。
6.便于团队开发和维护
W3C给我们定了一个很好的标准，在团队中大家都遵循这个标准，可以减少很多差异化的东西，方便开发和维护，提高开发效率，甚至 实现模块化开发。
遇到的问题：
效率太低了，又是划水的一天。
收获：
无
明日计划：
使用less重写以前的页面
完成深度思考
返回列表
评论