HTMLamp;amp;css面试题

1、iframe是用来在网页中插入第三方页面，早期的页面行使iframe首要是用于导航栏这种许多页面都沟通的部门，这样在切换页面的时辰停止一再下载。

1、便于修改，模仿疏散，像一些信息打点体系会用到。

2、但此刻根基不保举行使。除非非凡必要，一样平常不保举行使。

1、iframe的建设比一样平常的DOM元素慢了1-2个数目级

2、iframe标签会阻塞页面的的加载，假如页面的onload变乱不能实时触发，会让用户认为网页加载很慢，用户体验欠好，在Safari和Chrome中可以通过js动态配置iframe的src属性来停止阻塞。

3、iframe对付SEO不友爱，替代方案一样平常就是动态说话的Incude机制和ajax动态添补内容等。

• 1、box-sizing:用来指定模子的巨细的计较方法。首要分为border-box(从边框牢靠盒子巨细)、content-box(从内容牢靠盒子巨细)两种计较方法。
• 2、transition:当前元素只要有"属性"产生变革时，可以滑腻的举办过渡。通过transition-propety配置过渡属性；transition-duration配置过渡时刻；transition-timing-function配置过渡速率；transition-delay配置过渡延时。
• 3、translate：通过移动改变元素的位置；有x,y,z三个属性

• 1、！important>行内样式>id选择器>类选择器>标签选择器>通配符>担任
• 2、权重算法：(0,0)==》第一个0对应的是important的个数，第二个0对应的是id选择器的个数，第三个0对应的类选择器的个数，第四个0对应的是标签选择器的个数，就是当前选择器的权重

• 3、较量：先从第一个0开始较量，假如第一个0大，那么声名这个选择器的权重高，假如第一个沟通，较量第二个，依次类推。

• 用了display：flex属性，在IE10以下都是无效的。

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;
}

要领二

.content{
        position:absolute;
        left:50%;
        top:50%;
        width:200px;
        height:200px;
        background:red;
        -webkit-transform:translate(-50%,-50%);
        -moz-transform:translate(-50%,-50%);
        -o-transform:translate(-50%,-50%);
        -ms-transform:translate(-50%,-50%);
        transform:translate(-50%,-50%);
    }

• block 块范例。默认宽度为父元素宽度，可配置宽高，换行表现。
• none 缺省值。像行内元素范例一样表现。
• inline 行内元素范例。默认宽度为内容宽度，不行配置宽高，偕行表现。
• inline-block 默认宽度为内容宽度，可以配置宽高，偕行表现。
• list-item 像块范例元素一样表现，并添加样式列表标志。
• table 此元素会作为块级表格来表现。
• inherit 划定应该从父元素担任display属性的值。

• 块级元素：div,p,h1,form,ul,li
• 行内元素：span,a,label,input,img,strong,em;
• css盒模子：内容，border,padding;

• play()开始,pause()停息

• preload

• 标签选择符；类选择符；id选择符
• id>class>标签选择
• important优先级高

• 行使带clear属性的空标签；
• 行使css的overflow属性；
• 行使css的：after伪元素；

• 同时为了兼容 IE6，7 同样必要共同zoom行使

       .clear:after{content:'';display:block;clear:both;height:0;overflow:hidden;visibility:hidden;}
       .clear{zoom:1;}

• 行使连接元素处理赏罚；
• 父级配置成inline-block；
• br清浮动
• 以浮制浮（父级同时浮动）
• 给浮动元素父级配置高度
• 给父元素添加overflow：hidden 破除浮动要领；

• （编辑：湖南网）

  【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!