前端面试题、知识点整理(笔记一)

好记性不如烂笔头,一些前端的小tips,其实编程,很多时候不会把知识点都面面俱到,要学习的是编程思想,逻辑比较重要,同时养成比较好的编码习惯。面试基础很重要,这篇笔记记载一些前端面试的笔试题。
此为笔记一

下列哪个css属性不可继承(A)
A)height    C)text-align
B)font-size   D)text-indent
CSS中让元素隐藏,但是不清除元素的方法是(BA) .element { display: none; }
B) .element { visibility: hidden; }
C) .element { display: block;}
D) .element { visibility: visible; }

注: display和visibility的区别
display会将元素隐藏掉,并且位置不再被占据,而visibility则是占据原来的位置

清除浮动的方法有:给父元素增加高度、overflow:hiddenclear:both
盒子模型的实际宽度包括border-leftpaddingcontentborder-right,是它们的总和

注:盒子模型
CSS盒模型本质上是一个盒子,封装周围的HTML元素,它包括:边距,边框,填充,和实际内容。

总元素的宽度=宽度+左填充+右填充+左边框+右边框+左边距+右边距

总元素的高度=高度+顶部填充+底部填充+上边框+下边框+上边距+下边距
根据 W3C 的规范,元素内容占据的空间是由 width 属性设置的,而内容周围的 padding 和 border 值是另外计算的。不幸的是,IE5.X 和 6 在怪异模式中使用自己的非标准模型。这些浏览器的 width 属性不是内容的宽度,而是内容、内边距和边框的宽度的总和
解决IE8及更早版本不兼容问题可以在HTML页面声明 即可。

在实际开发中,我们定义宽度有时候会使用100%,实现自适应,这个时候,padding,border都属于该元素会比较方便,box-sizing: border-box 可以帮我们解决这个问题,border-box 告诉浏览器去理解你设置的边框和内边距的值是包含在width内的。

background-position主要用来设置背景图片位置。
页面上的定位主要有哪几种,分别是有哪些特点
绝对定位、相对定位、静态定位、固定定位
绝对定位:脱标,子元素相对于父元素左上角进行定位,如果父元素没有设置相对定位,则以浏览器可视区域最上角进行定位
相对定位:相对于元素自身的位置进行定位
静态定位:相当于块级元素
固定定位:脱标,可以一直固定在定位位置上
请简述"margin塌陷现象"的原因,并写出解决办法
答:
①垂直并列(少见)
当两个盒子在垂直方向上设置margin值时,会出现塌陷现象。
上下各自设置外边距
垂直之间塌陷的原则是以两盒子最大的外边距为准
②嵌套关系(常见)
当为子盒子添加margin-top:10px;时会发生如下情况:
子盒子和父盒子之间并没出现期望的10px间隙而是父盒子与子盒子一起与页面顶端产生了10px间隙。
解决方法:
(1)为父盒子设置border,为外层添加border后父子盒子就不是真正意义上的贴合。
(2)为父盒子添加overflowhidden;
(3)为父盒子设定padding值。
下面标签中不属于html结构标签的是:d
(A) DOCTYPE
(B) html
(C) title
(D) div
下面哪些操作内容可以在html中被有html代码中被识别:A
    (A) 一个空格 
    (B) 一个换行
    (C) 一个缩进 
    (D) 以上都不可以
哪些标签在页面上没有语义的  D
(A) p           (B) h 
(C) input       (D) span
如果希望一行上的文字与图片居中对齐,可以设置哪个属性:C
(A) margin: 0 auto;
(B) text-aline:center
(C) vertical-align: middle
(D) float: left
以下哪些操作不会脱离流B
(A) 浮动
(B) 相对定位
(C) 绝对定位
(D) 固定定位
var str = "11"+2-"1";
console.log(str);
console.log(typeof str);
执行完后str的值为___111____str的类型为_数字类型______
请列举出清除浮动的几种方式(最少三种)

ClearbothOverflow:hidden;

:after{
clearbothContent:0;
Height;0;
Line-height;0;
Disply;blockOverflowhidden;
}
.类{zoom;1}
简述您对HTML语义化的理解?
最好用html里面的标签定义。不能使用比如div类的标签定义

猜你喜欢

转载自blog.csdn.net/hani_wen/article/details/82657194
今日推荐