码迷,mamicode.com
首页 > Web开发 > 详细

web典型理论题整理HTML+CSS部分

时间:2017-04-15 22:43:58      阅读:310      评论:0      收藏:0      [点我收藏+]

标签:first   sla   倾斜   cat   image   article   计算   oca   如何   

1.css选择符有哪些?属性继承?优先级算法如何计算?css3新增伪类有哪些?
css选择符:id选择器(# myid)、类选择器(.myclassname)、标签选择器(div, h1, p)、相邻选择器(h1 + p)、子选择器(ul > li)、后代选择器(li a)、通配符选择器( * )、属性选择器(a[rel = "external"])、伪类选择器(a: hover, li:nth-child)
可继承样式:font-size、font-family、color、text-indent
不可继承样式:border、padding、margin、width、 height
优先级算法: 优先级就近原则,同权重情况下样式定义最近者为准; 载入样式以最后载入的定位为准;!important > id > class > tag; important 比 内联优先级高,但内联比 id 要高
CSS3新增伪类举例:
p:first-of-type 选择属于其父元素的首个 <p> 元素的每个 <p> 元素。
p:last-of-type 选择属于其父元素的最后 <p> 元素的每个 <p> 元素。
p:only-of-type 选择属于其父元素唯一的 <p> 元素的每个 <p> 元素。
p:only-child 选择属于其父元素的唯一子元素的每个 <p> 元素。
p:nth-child(2) 选择属于其父元素的第二个子元素的每个 <p> 元素。
:enabled :disabled 控制表单控件的禁用状态。
:checked 单选框或复选框被选中。
CSS3新特性:
CSS3实现圆角(border-radius),阴影(box-shadow),
对文字加特效(text-shadow、),线性渐变(gradient),旋转(transform)
transform:rotate(9deg) scale(0.85,0.90) translate(0px,-30px) skew(-9deg,0deg);// 旋转,缩放,定位,倾斜
增加了更多的CSS选择器 多背景 rgba
在CSS3中唯一引入的伪元素是 ::selection.
媒体查询,多栏布局
border-image
2.列出display的值,说明他们的作用
none 隐藏;block 块显示;inline 内嵌 ;table 表格显示;list-item 项目列表
3.position的值有哪些?relative和absolute定位的原点是?
absolute 生成绝对定位的元素,相对于定位以外的第一个祖先元素进行定位。
fixed生成绝对定位的元素,相对于浏览器窗口进行定位。
relative生成相对定位的元素,相对于其在普通流中的位置进行定位。
inherit 规定从父元素继承 position 属性的值。
4.Doctype作用? 严格模式与混杂模式如何区分?它们有何意义?
<!DOCTYPE> 声明位于文档中的最前面,处于 <html> 标签之前。告知浏览器以何种模式来渲染文档。
严格模式的排版和 JS 运作模式是 以该浏览器支持的最高标准运行。
在混杂模式中,页面以宽松的向后兼容的方式显示。模拟老式浏览器的行为以防止站点无法工作。
DOCTYPE不存在或格式不正确会导致文档以混杂模式呈现。
5.H5有哪些新特性?移除了哪些元素?
新特性:
内容元素,article、footer、header、nav、section。
表单控件,calendar、date、time、email、url、search。
控件元素,webworker, websockt, Geolocation。
移出的元素:
显现层元素:basefont,big,center,font, s,strike,tt,u。
性能较差元素:frame,frameset,noframes。
6.如何处理H5新标签的浏览器兼容性问题?如何区分HTML和HTML5?
处理兼容问题有两种方式:
IE8/IE7/IE6支持通过document.方法产生的标签,利用这一特性让这些浏览器支持HTML5新标签。
使用是html5shim框架
DOCTYPE声明的方式是区分HTML和HTML5标志的一个重要因素,此外,还可以根据新增的结构、功能元素来加以区分。
7.CSS引入的方式有哪些? link和@import的区别是?
内联 内嵌 外链 导入
区别 :同时加载
前者无兼容性,后者CSS2.1以下浏览器不支持
Link 支持使用javascript改变样式,后者不可
8.iframe的缺点?

9.列举几种页面优化方案?

10.bootscript是什么?能做什么?

11.描述一下css的animation和transition各自的特点?

12.实现双栏布局,左边固定不动,右面根据屏幕自适应(不用JS)

13.在移动端制作WEBapp优化页面的方案?

14.如何让一个元素水平垂直居中?

15.页面布局的方式?

16.设置超出文本宽度自动显示省略号?

17.css script是什么?优缺点?

前端大框

1.前端有哪几个层面组成?作用是什么?

2.从前端出发做好SEO需要考虑什么?

3.浏览器cookie的理解?

web典型理论题整理HTML+CSS部分

标签:first   sla   倾斜   cat   image   article   计算   oca   如何   

原文地址:http://www.cnblogs.com/shanhaihong/p/6714551.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!