常见css3小属性测试

由于我对css3 的偏爱，所以把一些自己学习中考过的属性和知识点和大家分享一下！可能自己回答的不全面，但是还是可以看的吧！嘻嘻！

              （注：题型的参考来自于我爱考试 中css3  题库的知识点，有兴趣的博友们可以参考一下哦！）

1.请列举 3个 CSS3 边框属性名称（5）

border-image 设置所有 border-image-* 属性的
简写属性。
border-radius 设置所有四个 border-*-radius 属
性的简写属性。
box-shadow 向方框添加一个或多个阴影。

2.请列举 3个 CSS3 背景属性名称（5）

background-clip 规定背景的绘制区域。
background-origin 规定背景图片的定位区域。
background-size 规定背景图片的尺寸。

3.请列举 2个 CSS3 文本属性名称（5）

hanging-punctuation 规定标点字符是否位于线框之外。
punctuation-trim 规定是否对标点字符进行修剪。
text-align-last 设置如何对齐最后一行或紧挨着强
制换行符之前的行。
text-emphasis 向元素的文本应用重点标记以及重
点标记的前景色。
text-justify 规定当 text-align 设置为 "justify"
时所使用的对齐方法。
text-outline 规定文本的轮廓。
text-overflow 规定当文本溢出包含元素时发生的
事情。
text-shadow 向文本添加阴影。
text-wrap 规定文本的换行规则。
word-break 规定非中日韩文本的换行规则。
word-wrap 允许对长的不可分割的单词进行分
割并换行到下一行。

4.请写出 CSS3 2D转换属性名称 及其相关属性值（10）

transform 向元素应用 2D 或 3D 转换。
transform-origin 允许你改变被转换元素的位置。

2D Transform 方法

matrix(n,n,n,n,n,n) 定义 2D 转换，使用六个值的矩阵
。
translate(x,y) 定义 2D 转换，沿着 X 和 Y 轴移动
元素。
translateX(n) 定义 2D 转换，沿着 X 轴移动元素
。
translateY(n) 定义 2D 转换，沿着 Y 轴移动元素
。
scale(x,y) 定义 2D 缩放转换，改变元素的宽
度和高度。
scaleX(n) 定义 2D 缩放转换，改变元素的宽
度。
scaleY(n) 定义 2D 缩放转换，改变元素的高
度。
rotate(angle) 定义 2D 旋转，在参数中规定角度
。
skew(x-angle,y-angle) 定义 2D 倾斜转换，沿着 X 和 Y 轴
。
skewX(angle) 定义 2D 倾斜转换，沿着 X 轴。
skewY(angle) 定义 2D 倾斜转换，沿着 Y 轴。

5请写出 CSS3 过渡属性的名称（5）

transition 简写属性，用于在一个属性中设置
四个过渡属性。
transition-property 规定应用过渡的 CSS 属性的名称。
transition-duration 定义过渡效果花费的时间。默认是
0。
transition-timing-function 规定过渡效果的时间曲线。
"ease" 缓解效果=== cubic-bezier(0.25,0.1,0.25,10.) ----立方贝
塞尔
"linear" 线性效果===cubic-bezier(0.0,0.0,1.0,1.0)
“ease-in” 渐显效果===cubic-bezier(0.42,0,1.0,1.0)
"ease-out" 渐隐效果===cubic-bezier(0,0,0.58,1.0)
"ease-in-out" 渐显渐隐效果===cubic-bezier(0.42,0,0.58,1.0)
"cubic-bezier" 特殊的立方贝赛尔曲线效果

transition-delay 规定过渡效果何时开始。默认是 0
。

6.请写出 CSS3 有关动画定义关键帧的单词及定义动画属性的名称（5）

@keyframes 规定动画。
animation 所有动画属性的简写属性，除了
animation-play-state 属性。
animation-name 规定 @keyframes 动画的名称。
animation-duration 规定动画完成一个周期所花费的秒
或毫秒。默认是 0。
animation-timing-function 规定动画的速度曲线。默认是
"ease"。
animation-delay 规定动画何时开始。默认是 0。
animation-iteration-count 规定动画被播放的次数。默认是 1
。
animation-direction 规定动画是否在下一周期逆向地播
放。默认是 "normal"。
animation-play-state 规定动画是否正在运行或暂停。默
认是 "running"。
animation-fill-mode 规定对象动画时间之外的状态。

7.请列举 3个 CSS3 用户界面属性名称（5）

appearance 允许您将元素设置为标准用户界面元
素的外观
box-sizing 允许您以确切的方式定义适应某个区
域的具体内容。
icon 为创作者提供使用图标化等价物来设
置元素样式的能力。
nav-down 规定在使用 arrow-down 导航键时向
何处导航。
nav-index 设置元素的 tab 键控制次序。
nav-left 规定在使用 arrow-left 导航键时向何
处导航。
nav-right 规定在使用 arrow-right 导航键时向
何处导航。
nav-up 规定在使用 arrow-up 导航键时向何
处导航。
outline-offset 对轮廓进行偏移，并在超出边框边缘
的位置绘制轮廓。
resize 规定是否可由用户对元素的尺寸进行
调整。

8.请写出 谷歌浏览器 中应用颜色渐变的css3属性名称及两种渐变类型关键英文单
词（15）
-webkit-gradient 渐变
linear 线性渐变
radial 径向渐变

9.请写出 文字阴影和文本阴影的属性名称（10）

text-shadow 向文本/文字添加阴影。

10.请写出 媒体查询 的两种应用模式（10）

Media Quueries链接外部css样式表文件，在link标签中设置media属
性（link）
在css样式中写入media属性

11.请列举一下 盒布局中新增的属性名称 并说明其应用于父元素 还是子元素（25
）

display:box; 父元素
box-align 父元素
box-pack 父元素
box-orient 父元素
box-vertical 父元素
box-flex 子元素
box-oridinal-group 子元素

  

 

              （附注：我爱考试网 中包含了许多有关于IT行业知识的题型，还有几款比较好玩的智力游戏，都是关于IT行业知识的。）