CSS & RWD 測驗

CSS & RWD 測驗

University - Professional Development

20 Qs

quiz-placeholder

Similar activities

GCE Level 2 熱身測驗 (2)

GCE Level 2 熱身測驗 (2)

Professional Development

22 Qs

課程發展、課程實施與課程領導

課程發展、課程實施與課程領導

Professional Development

20 Qs

生涯規劃

生涯規劃

University

20 Qs

新冠肺炎COVID-19

新冠肺炎COVID-19

Professional Development

16 Qs

社課問答

社課問答

University

20 Qs

四年级科学 第一课 科学技能

四年级科学 第一课 科学技能

KG - Professional Development

22 Qs

信用卡業務-小小兵卡

信用卡業務-小小兵卡

Professional Development

22 Qs

18 認知, 19 認知信念, 20感覺

18 認知, 19 認知信念, 20感覺

University

21 Qs

CSS & RWD 測驗

CSS & RWD 測驗

Assessment

Quiz

Design, Professional Development, Education

University - Professional Development

Medium

Created by

Carlos Chang

Used 7+ times

FREE Resource

20 questions

Show all answers

1.

MULTIPLE CHOICE QUESTION

45 sec • 1 pt

以下哪個 Media Query 有語法上的錯誤?

@media print {

}

@media (min-width: 768px) {

}

@media (min-width: 768px) or (max-width: 991px) {

}

@media screen and (min-width: 1200px) {

}

2.

MULTIPLE SELECT QUESTION

45 sec • 1 pt

CSS 的 position 屬性,包含了哪些?

relative

sticky

absolute

static

fixed

3.

FILL IN THE BLANK QUESTION

45 sec • 1 pt

預設上,當一個區塊,設定寬度(width)或高度(height)的時候,指的是內容區域,如果希望算到邊框(border)的話,那應該設定 box-sizing 為哪個屬性值?

4.

MULTIPLE CHOICE QUESTION

45 sec • 1 pt

在做 RWD 的時候,需要加上以下哪個 viewport?

<meta name="description" content="html is responsible for structure, css for visual.">

<meta charset="utf-8">

<meta name="keywords" content="html, css, viewport">

<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no, user-scalable=0">

5.

MULTIPLE SELECT QUESTION

45 sec • 1 pt

bootstrap 格線系統的 .row 當中,運用到了 margin 負邊界,所以將 .row 放在 div 裡的時候,這個 div 務必加上以下哪兩個屬性,以致於 .row 的範圍才不會超出去?

margin-left: 15px;

padding-left: 15px;

margin-right: 15px;

padding-right: 15px;

6.

FILL IN THE BLANK QUESTION

45 sec • 1 pt

CSS 當中的哪一個屬性,可以讓某元素套用之後,可以設定該元素的左邊、右邊,都不能有任何的浮動元素,如果有的話,該元素就會一直往下掉,掉到左右都沒有浮動元素為止。

7.

MULTIPLE CHOICE QUESTION

45 sec • 1 pt

以下哪個寫法,可以特別指定在列印的時候,將 a 標籤的文字顏色改為紅色?

@media screen {
  a {
    color: red;
  }
}

@media print {
  a {
    color: red;
  }
}

@media print {
  a {
    background-color: red;
  }
}

@media (min-width: 768px){
  a {
    color: red;
  }
}

Create a free account and access millions of resources

Create resources
Host any resource
Get auto-graded reports
or continue with
Microsoft
Apple
Others
By signing up, you agree to our Terms of Service & Privacy Policy
Already have an account?