Web前端开发-网页设计 习题-权小红 在线练习-单元5

5.1在线练习

一、单选

I.关于CSS3,说法错误的是()

A、是CSS2.0的升级版。

B、不同浏览器厂商、同一浏览器的不同版本对CSS3的支持都或有不同。

C、CSS3规范已经完整发布，并且的固定。

D、CSS3规范是模块化开发的。

2.CSS3新增的颜色值表示方式是()

A、英文单词

B、十六进制

C、rgb()

D、hsla()

3.CSS的颜色值正确的表达形式()

A、rgba(360,0,0,1)

B、rgba(256,1,250,0)

C、rgba(00,0,1)

D、rgba(250,0,0,2)

4.下列属于绝对长度单位的是()。

A、px

B、%

C、em

D、rem

二、判断(正确为T,错误为F)

1.rgba(r,g,b,a)函数的参数依次设定颜色中红、蓝、绿的值和颜色的透明度。

()

2.rgba(255,0,0,0.5)表示半透明的完全绿色。()

3.hsl(h,s,l)函数是CSS3新增的颜色表示方法，基于一个360度的色相环。

()

4.em是相对于当前父元素的字体大小为标准，而rem是相对于根元素(html元

素)的字体大小为标准。()

5.2在线练习

一、单选

1.下列选择器中，用于选搭某个元素的第一级子元素的有()0

A、子代选择器

B、兄弟选择器

C、属性选择器

D、伪类选择器

2.CSS3中，用于为父元素中的倒数第n个子元素设置样式;的选择器是()。

A>:last-chiId|

B、:nth-of-type

C、:nth-last-child()

D、:nth-chiId()

3.下列选项中，与选择某个元素的子元素无关的选择器有()。

A、:last-chiId

B、:first-child

C、:not

D、:nth-child()

4.以下()将奇数个li元素字体设置为红色

A、li:nth-child(2n){coloured;}

B、li:nth-child(n+1){coloured;}

C、li:nth-child(even){color:red;}

D^li:nth-chikl(odd){color:red;}

5.CSS3中，()选择器用来选择没有子元素或文本齿容为空的所有元素。

A、:last-child()

B、:empty

C、:not

D、:nth-child()

6.HTML代码：

<ul>

<div>divl</div>

<li>l</Ii>

<li>2</li>

<li>3</li>

</ul>

<ul>

<div>divl</div>

<li>A</li>

<li>B</li>

<li>C</li>

</ul>

CSS代码：

li:nth-of-type(1){

color:red;

)

哪些元素变为红色？

A、1

B、A

C、1和A

D、没有元素变为红色

7.HTML代码：

<ul>

<div>divl</div>

<li>l</li>

<li>2</li>

<li>3</li>

</ul>

<ul>

<div>div1</div>

<li>A</ii>

<li>B</li>

<li>C</li>

</ul>

CSS代码:

li:nlh-child(1)(

color:red;

}

哪些元素变为红色？

A、1

B、A

C、1和A

D、没有元素变为红色

8.以下css3属性选择器中，用于选择类名以“red”开头的li元素的是（）

A、li[class=rcd]

B、li[class"=red]

5.text-shadow默认投影方式是（）。

A、外阴影

B、内阴影

C、水平偏移

D、垂直偏移

二、判断（正确为T,错误为F）

1.word-wrap取值为normal时表示允许在长单词或URL地址内部进行换行。（）

2.text-overflow属性需要配合overflow:hidden；使用。（）

3.text-shadow属性默认投影颜色为黑色。（）

4.text-shadow属性的默认值为无阴影。（）

5.使用text-shadow属性，一次可为文本添加多个阴影。（）

6.在设置多列文本时，column-span属性用于设置或检索元素横跨多少列。（）

7.column-count和column-width这两个属性不可以同时都设置。（）

8.通过@font-face规则，开发者便可以使用用户计算机未安装的字体。（）

5.4在线练习

一、单选

1.以下选项，用来设置背景图像URL的样式属性是（）

A^background-image

B、background-repeat

C、background-position

D、background-url

2.如果背景图像的background-attachment属性为（），则background­

origin属性没有效果。

A、scroll

B、fixed

C、strech

D、relative

3.background-size属性值设置为（）时，将背景图像等比例缩放到宽度或高

度与容器宽度或高度相等，背景图像始终被包含在容器内。

A、percentage

B、cover

C、contain

D、length

4.下列选项中，设置背景图完全覆盖背景区域的取值为（）

A、cover

B、length

C、percentage

D、contain

5.CSS3用于设置渐变的属性是（）。

A>color

B、border

C、background-image

D、background-color

6.linear-gradient（）函数的参数不包含的是（）。

A、方向

B、起点颜色

C、终点颜色

D、形状

7.定义左上角圆角边框的是（）。

A、border-top-left-radius

border-1eft-top-radius

C>top-1eft-border-radius

D、left-top-border-radius

8.border-image的子属性巾，定义裁切图像方式的属性是（）。

A、border-image-source

B、border-image-slice

C、border-image-repeat

D、border-im<ige-outset

9.F列选项中，设置外阴影且阴影在盒子右侧的选项是OD

A、box-shadow:7px-4px10px#000inset;

B、box-shadow:-7px4pxlOpx#000;

C、box-shadow:7px4pxlOpx#000inset;

【）、box-shadow:7px-4pxlOpx#000;

二、判断（正确为T,错误为F）

1.background-size属性的取值除cover和contain外，还可以设置为一个或两个

值，第一个值设置宽度，第二个值设置的高度。若只给出一个值，则第二个值为

auto（自动）。（）

2.线性渐变使用radial-gradient属性设置。（）

3.线性渐变的起始颜色和结束颜色之间可以添加多个颜色值，颜色值之间用丁间

隔。（）

4.使用border-radius属性为元素设置圆角边框时，4个角的圆角半径必须一样。

（）

5.border-style属性用于设置圆角边框。（）

6.border-image属性可以设置以图片填充元素的边框。（）

7.box-shadow属性用于为元素添加阴影，若一次添加多个阴影，各阴影的设置之

间用”;"分隔。（）

8.h・shadow参数表示水平阴影的位置，不可以为负值。（）

5.5在线练习

一、单选

1.box-sizing属性的取值中，通过从已设定的宽度或高度中分别减去边框和内边距

才能得到内容的宽度或高度的是。（）

A、none

border-box

C、contcnt-box

D、padding-box

2.弹性盒布局中,flex-direction的默认值为（）

A^row

B、row-reverse

C^column

D、column-reverse

3.下列选项中，用于设置弹性盒子元素在主轴方向逆序持列的是（）。

A^flex-direction：row;

B、flex-direction：row-reverse;

C、flex-direction：column;

D、flex-direction：column-reverse;

4.justify-content属性的下列取值中，中间子元素之间的间隔是两端子元素与边框

距离两倍的是。（）

A^flex-start

B、flex-end

C、space-between;

D、space-around

5.设置或检索弹性盒子元素在侧轴方向上的对齐方式的属性（）。

A、flex-direction

B、justify-content

C、align-iterns

D、flex-wrap

二、判断（正确为T,错误为F）

1.box-sizing属性设置元素占用的实际总宽度或高度是否需要加上内边距和边

框。（）

2.box-sizing属性的默认取值是border-box。（）

3.通过将元素的display属性设为flex或inline-flex,可将元素定义为弹性容

器。（）

4.弹性盒由容器、父元素和轴构成。（）

5.弹性子元素的order属性设置弹性子元素在弹性容器中的出现顺序，默认为0,

可以为负值。（）

5.6在线练习

一、单选

1.CSS3中的过渡属性是（）

A、transform

B、translate

C、transition

D、trancation

2.CSS3中的变形属性是（）

A、transform

B、translate

C、transition

D、trancation

3.关于transition-property属性的描述，下列说法正确的是（）。

A、用于指定应用过渡效果的CS5属性的名称。

B、用于定义完成过渡效果需要花费的M间。

C、规定过渡效果中速度的变化。

D、规定过渡效果何时开始。

4.transition-duration属性用于定义过渡效果花费的时间，默认值为()。

A、none

B、0

C、1ms

D、auto

5.下列关丁•iriui'fuiiii属性的说法中，错误的是()。

A、默认值为none

B、允许向元素应用2D或3D转换。

C、允许对元素进行旋转、缩放、移动或倾斜

D、就是平滑的改变一个元素的CSS值

6.在CSS3中，可以实现平移效果的函数是()。

A、translate()

B、scale()

C、skew()

I)、rotate()

7.下列将页面上div元素绕中心点逆时针旋转30度的是()。

A^div{transform:rotate(30deg);}

B、div{transform:rotate(330deg);)

C、div{transform:rotateY(30deg)

D、div{(ransfbrm:rota(eX(30deg);)

8.rotateX函数用于指定元素围绕X轴旋转，参数a用于定义旋转的角度值，单位

为()。

A、deg

px

C、%

D、pi

9.css3中的动画属性及定义动画的关键字是()

A、animator^O@kcy-framc?;

B、animator和@keyframes;

C、animati