HTML及CSS的小题库

1.HTML中的注释为 ：

2.CSS中的注释为:

3.在相对路径中, ./ 表示当前目录, ../表示上一级目录, / 表示根目录
4.表单中单选框属性为 radio，复选框属性为为 checkbox ,单行文本框属性为 text ，文件上传按钮属性为 file ，多行文本框属性为 textarea ，下拉菜单属性为 select 。
5.form表单中定义表单提交方式的属性为 method，其常见的属性值为 get 和 post 。属性 action 表示当提交表单时，向何处发送表单数据。
6.为html添加css样式的方式有 内嵌式style="" , 嵌入head , 外部css引入 。
7. 控制层叠顺序的CSS属性是 z-index 。
8. 清除浮动的css声明是 clear:both; 和 overflow:hidden;
9. html和CSS是什么？有什么关系？
html全称HyperText Markup Language，是超文本标记语言。用来写页面结构
css全称cascading style sheets，是层叠样式表，用来写页面表现，页面样式。
css需要依赖于html在浏览器上显示。
10.什么样的元素是定位元素？定位元素有什么特性？
position属性修饰，position值为 fixed absolute relative 的时候，这个属性为定位属性。
定位元素可以使用left,top,bottom,right定位属性。
fixed ----- 固定定位 相对与浏览器
absolute ----- 绝对定位 相对于离它最近的父级定位元素或者视口区
relative ----- 相对定位 相对于它原来的位置
11.什么是盒子模型？有哪几种？有什么区别？如何切换？
盒子模型是一种模型，将页面中的元素都看做盒子，由内容区,padding区，border区，margin区组成。
有两种，分别是w3c盒子模型和ie盒子模型。

w3c盒子（标准）
	内容区宽高：设置的width，height
	盒子宽高：内容区的宽高+padding区的宽高+border区的宽高
	所占屏空间的宽高：内容区的宽高+padding区的宽高+border区的宽高+margin区的宽高
	
IE盒子
	内容区宽高：设置的width，height-border区的宽高-padding区的宽高
    盒子宽高：设置的width，height
	所占屏空间的宽高：设置的width，height +margin区的宽高

切换：
box-sizing:content-box;(w3c盒子)
box-sizing:border-box;(ie盒子)
12.简述盒子水平居中的方式？文本水平居中的方式？
盒子居中方式1
1) 盒子具备绝对宽度
2) margin:0 auto

盒子居中方式2
1) 盒子具备绝对宽度
2) margin-left=(父级宽度-盒子的宽度)/2

文本水平居中的方式 text-align:center;
13.列举3种常见的css兼容性问题以及解决方案：
div img
a img
双倍间距
14.块级元素有哪些？行内元素有哪些？行内元素与块级元素分别有什么特点？

块级： div h1~h6 p ul ol dl form table
	独占一行空间
	可以指定宽高
	
行内： span a s i b strong 
	不独占一行空间
	不可以指定宽高
	使用display进行切换
	
    display:inline;  行内显示，宽高无效 
	display:block;  块级显示，可设置宽高
	display:inline-block; 行内显示，可设置宽高

15.常见的CSS选择器有几种？
color:red!important; 优先级最高，但是在ie6中不支持
color:orange;
style=" color:gray"
层级选择器
后代选择器 div one
子代选择器 div>one
复合选择器
div.one
ID选择器
#ID
类选择器
.ClassName
标签选择器
div，span，a，img …
组合选择器
div.span , div.one
16.CSS级联是什么？CSS级联由什么决定？
CSS级联是给同一个元素设置了不同的样式的时候，最终采取什么样式的解决方案。由以下3方面决定。

1）是否使用!important修饰
	最优先
	
2）判断特性值
	style属性内1000
	id选择器 100
	class选择器，伪类选择器，属性选择器 10
	标签选择器，伪元素选择器  1
	其他  0
	选择器特性值越高的越优先
	
3）就近原则
	如果都没有使用!important修改，并且特性值一样的情况下，后边的覆盖前边的。越靠近html的越优先。

17.分别说明如何取消body, ul，li，a标签的默认样式？
body,ul{
margin:0;
padding:0;
}
li{
list-style:none;
}
a{
text-decoration:none;
color:#000;
}
18. display常见属性值为什么？并说明取不同值时的含义。
inline ----- 行内
block ----- 块级
inline-block ------ 块级行内 (vertical-align)
none ------ 隐藏
flex ------ 弹性盒容器
19.实现动画需要使用什么CSS属性？分别有什么作用？
animation 速写属性
animation-name动画名字
animation-duration 动画持续时间
animation-iteration-count 动画迭代次数
animation-delay 动画延迟
animation-direction 动画方向
animation-play-state 动画播放状态
animation-fill-mode 动画填充模式
animation-timing-function 动画速度曲线
transition 过渡属性