Graphical web page design unit test

1. Multiple choice questions (9 questions in total, 45.0 points)

  1. (Multiple choice, 5.0 points)
    Commonly used image tags in HTML5 web pages are ( ).
    A <img> tag
    B <figure> tag
    C <figcaption> tag

    D <i> tag

  2. (Multiple choice, 5.0 points)
    Regarding the CSS3 sprite technology, the following is the correct understanding ( ).
    A Its essence is to combine multiple small pictures into one picture.
    B is to use it to improve web page performance.
    C When visiting this page, only need to load the picture once.
    D Use the combination of "background-image", "background-repeat", and "background-position" for background positioning, and display a certain part of a large picture at a fixed position on the web page.

  3. (Multiple choice, 5.0 points)
    The properties that can be used for animation in CSS3 are ( ).
    A transition
    B transform
    C animation

    D background

  4. (Multiple choice, 5.0 points)
    When defining an animation, the keyframe selector is used to specify the position value of the current keyframe to be applied to the entire animation process, and the keyframe selector can be ( ).
    A A percentage
    B from, which has the same effect as 0% to indicate the start of the animation

    C any name
    D to, it has the same effect as 100% to indicate the end of the animation

  5. (Multiple choice, 5.0 points)
    Regarding 3D deformation, which of the following statements is correct ( ).
    A perspective attribute defines the perspective view of the 3D transformed element.
    The parameter value of the B perspective function is a value representing the perspective depth.

    C Use the skew function to achieve stereo effects.
    D 3D deformation refers to the transformation of an element around its x-axis, y-axis, and z-axis, such as rotation, scaling, and translation.

  6. (Multiple choice, 5.0 points)
    CSS3's deformation attribute transform is an attribute related to animation. 2D shape transformation can be divided into ( ) several types.
    A rotate
    B tilt
    C zoom
    D move

  7. (Multiple choice, 5.0 points)
    The deformation of an element has an origin, and the element is deformed or rotated around this point. The following description of the origin is correct ( ).
    A The default origin starting position is the center position of the element.
    B Use the transform-origin property to specify the origin on which the element's transformation is based.
    C transform-origin accepts up to three values, which are the offsets of the x-axis, y-axis, and z-axis.

    D The offset of the z-axis can be given in addition to a specific length value, and there are other ways to give values.

  8. (Multiple choice, 5.0 points)
    In the grammar {transition:property duration timing-function delay;} of setting transition, the expression is wrong ( ).
    A property: The name of the CSS property to which the transition is applied, which can only take the value of none or all.
    B delay: The time to wait before the transition effect starts.
    C duration: The time spent by the transition effect, any value can be used to see the transition effect.
    D timing-function: the time curve of the transition effect.

  9. (Multiple choice, 5.0 points)
    The correct description of the parameter color stop of the gradient setting is ( ).
    A The area between two color stops is the color transition area.
    B color stop is used to set the color boundary.
    In C color stop, color is the color of the border, and stop is the position of the border.
    D stop is a percentage and less than 0% or greater than 100%, it means that the boundary is outside the visible area.

2. Multiple choice questions (6 questions in total, 30.0 points)

  1. (Single-choice question, 5.0 points)
    CSS3 uses the () attribute to use the defined animation.
    A @keyframes
    B animation
    C transition
    D transform

  2. (Single-choice question, 5.0 points)
    CSS3 transitions are set using ( ) attributes.
    A linear-gradient
    B radial-gradient
    C border-radius
    D transition

  3. (Single-choice question, 5.0 points)
    Regarding the rounded border, the following description is incorrect ( ).
    A The rounded border is actually inscribed circles at the four corners of the rectangle, and the arc of the rounded corners is controlled by setting the radius of the inscribed circles.
    B uses the border-radius property to achieve rounded border settings.
    C When setting the radius, if there is no "/", it means that the horizontal and vertical radii are equal.
    D When setting the radius, the one in front of "/" means the vertical radius.

  4. (Single-choice question, 5.0 points)
    The gradient in CSS3 is set using the ( ) property.
    A background-color
    B background-attachment
    C background-image
    D background-position

  5. (Single-choice question, 5.0 points)
    CSS3 sets the shadow of an element (box) using the ( ) property.
    A text-shadow
    B shadow
    C border-shadow
    D box-shadow

  6. (Single-choice question, 5.0 points)
    Regarding the default setting of the background attribute, the following is incorrect ( ).
    A background-color is transparent
    B background-repeat is repeat
    C background-attachment为fixed
    D background-image is none

3. True or false questions (7 questions in total, 35.0 points)

  1. (True or false, 5.0 points)
    When using the @keyframes rule to create an animation, you do not need to specify the name of the animation.
    A pair
    B wrong

  2. (True or false, 5.0 points)
    The coordinates of the center of the radial gradient are by default at the center of the element.
    A pair
    B wrong

  3. (True or false, 5.0 points)
    Linear gradients are the same as radial gradients, and the colors gradually change in a certain direction.
    A pair
    B wrong

  4. (True or false, 5.0 points)
    The default gradient shape of radial gradient is ellipse.
    A pair
    B wrong

  5. (True or false, 5.0 points)
    The side-or-corner parameter in the linear gradient is used to determine the direction of the gradient through keywords, and the default value is top (from top to bottom).
    A pair
    B wrong

  6. (True or false, 5.0 points)
    In an HTML page, the coordinate system usually takes the upper left corner of the box corresponding to the reference element as the coordinate origin, the horizontal direction to the right is the positive direction of the x-axis, and the vertical direction is the positive direction of the y-axis.
    A pair
    B wrong

  7. (True or false, 5.0 points)
    If the expansion radius of the element shadow is positive, the entire shadow will be expanded; otherwise, if the radius is negative, it will be reduced.
    A pair
    B wrong

Guess you like

Origin blog.csdn.net/qq_46373141/article/details/130730849