Skip to content

Instantly share code, notes, and snippets.

@taichunmin
Last active August 29, 2015 14:10
Show Gist options
  • Save taichunmin/412e65d1f9064705ad48 to your computer and use it in GitHub Desktop.
Save taichunmin/412e65d1f9064705ad48 to your computer and use it in GitHub Desktop.
20141127-bootstrap-quiz.md

HTML Quiz

填表網址:http://goo.gl/forms/qaXu7OQmsl

Quiz #1

請問 BootstrapGrid System 把寬度分成多少等分?把螢幕寬度分成多少個等級?

  1. 分成 12 等分、分成 4 個等級。
  2. 分成 10 等分、分成 4 個等級。
  3. 分成 12 等分、分成 6 個等級。
  4. 分成 10 等分、分成 6 個等級。

Quiz #2

請問以下何者瀏覽器不能完美支援 Bootstrap

  1. Chrome 最新版
  2. Internet Explorer 7
  3. Internet Explorer 9
  4. Firefox
  5. Safari

Quiz #3

如果使用 Internet Explorer 8,需要額外加上什麼才可以確保 Responsive Web Design 運作正常?

  1. jquery.min.js
  2. respond.min.js
  3. html5shiv.min.js
  4. bootstrap.min.js

Quiz #4

Bootstrap 採用何種授權? http://inspire.twgg.org/internet/trends/item/74-comparison-of-five-kinds-of-standard-open-source-license-bsd-apache-gpl-lgpl-mit.html

  1. Creative Commons
  2. MIT
  3. GPL
  4. Apache
  5. BSD

Quiz #5

請問 Bootstrap 的 Github Repo 的網址是?

(填充題)

Quiz #6

請問以下哪個套用 Bootstrap 正確?

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap-theme.min.css">
</head>
<body>
	<!-- ... 省略 ... -->
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap-theme.min.css">
</head>
<body>
	<!-- ... 省略 ... -->
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap-theme.min.css">
</head>
<body>
	<!-- ... 省略 ... -->
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap-theme.min.css">
</head>
<body>
	<!-- ... 省略 ... -->
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap-theme.min.css">
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>
</head>
<body>
	<!-- ... 省略 ... -->
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
</body>
</html>

Quiz #7

請問 Bootstrap 是以什麼媒體為設計優先?

  1. PC First
  2. Mobile First
  3. iPhone/iPad First
  4. Printer First

Quiz #8

請問 Sublime Text 3 的哪個套件可以幫你快速打出 HTML?

(填充題)

Quiz #9

請問哪些網址可以連線到本機網頁伺服器?

  1. git://localhost/
  2. ftp://localhost/
  3. http://192.168.1.1/
  4. http://[::1]/

Quiz #10

請問如果希望某個物件只在大於 992 px 顯示,應該使用以下哪組 class

  1. class="hidden-xs hidden-print"
  2. class="hidden-xs hidden-sm"
  3. class="visible-lg-* hidden-sm"
  4. class="visible-md-* visible-xs-*"

Quiz #11

請問以下何者套用 glyphicon 正確?

  1. <a href="#"><span class="glyphicon glyphicon-leaf">leaf</span></a>
  2. <a href="#"><span class="glyphicon glyphicon-leaf">leaf</a></span>
  3. <a href="#"><span class="glyphicon glyphicon-leaf"></span>&nbsp;leaf</a>
  4. <a href="#" class="glyphicon glyphicon-leaf"><span></span> leaf</a>

Quiz #12

請問 .sr-only 的用途是?

  1. 讓該物件只在螢幕上顯示
  2. 讓該物件只能在列印顯示
  3. 讓該物件平時隱藏,並且讓螢幕閱讀工具可以正常讀取資料
  4. 讓該物件可以隱藏一些秘密資料
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment