-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy path20210302exercise.html
151 lines (144 loc) · 5.29 KB
/
20210302exercise.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h1><p>前端技術</p></h1>
學習前端技術除了要會使用他,還需要了解其原理運作,
因此<>「觀念建立」</>與<b>「反覆練習」</b>是每天提供自己成長的養分,
唯有在觀念建立之後的反覆練習,才能在不斷錯誤中找到正確的答案,
為自己打下深厚的基礎,日後在專題設計才能獨當一面,
設計出結構穩固、美觀且具有互動功能的網站,遇
到不了解或是網際的語法,
可以善用<a href="http://www.goolge.com" target="blank">Google</a>
或前往<a href="https://developer.mozilla.org/zh-CN/" target="blank">MDN</a>
與<a href="https://www.w3schools.com/" target="blank">W3school</a>查詢
<br>
<ul><li><a href="#HTML">HTML</a></li>
<li><a href="#CSS">CSS</a></li>
<li><a href="#Javascript">Javascript</a></li>
<li><a href="#jQuery">jQuery</a></li>
<li><a href="#Bootstrap">Bootstrap</a></li>
</ul>
<hr>
<img src="../練習作業/images/html5.jpg" alt="HTML5" id="HTML" width="200">
<h1><p> HTML-負責架構、內容</p></h1>
超文本標記語言(英語:HyperText Markup Language,簡稱:HTML)
是一種用於建立網頁的標記語言。
HTML是一種基礎技術,常與CSS、JavaScript一起被眾多網站用於設計賞心悅目的網頁、
網頁應用程式以及行動應用程式的使用者介面。網頁瀏覽器可以讀去HTML檔案,
並將其彩現成視覺化網頁。HTML描述了一個網站的結構語意的呈現,
使之成為一種標記語言而非程式語言。
<h3><p>基礎結構:</p></h3>
     <html>
<br>
       <head>
<br>
<br>
       </head>
<br>
       <body>
<br>
<br>
       </body>
<br>
     </html>
<h3>標籤特性:</h3>
<ol>
<li>標籤不分大小寫,但請用小寫。</li>
<li>"<>"開頭,"</>結尾"。</li>
<li>標籤具有屬性與值的特性。</li>
<li>標籤標記內容,產生語義,組合成了結構。</li>
</ol>
<a href="#">回頂端</a>
<hr>
<img src="../練習作業/images/CSS.jpg" alt="CSS" id="CSS" width="200">
<h1><p>CSS-負責外觀、樣式</p></h1>
層疊樣式表(英語:Cascading Style Sheets,縮寫:CSS;
又稱串樣式列表、級聯樣式表、串接樣式表、階層式樣式表)
是一種用來為結構化文件(如HTML文件或XML應用)添加樣式
(字型、間距和顏色等)的電腦語言,由W3C定義和維護。
目前最新版本是CSS2.1,為W3C的推薦標準。
CSS3現在已被大部分現代瀏覽器支援,
而下一版的CSS4仍在開發中。
<br>
<br>
<a href="#">回頂端</a>
<hr>
<img src="../練習作業/images/JS.jpg" alt="Javascript" id="Javascript" width="200">
<h1><p>JavaScript-負責行為、互動</p></h1>
JavaScript(通常縮寫為JS)是一種進階的、
直譯的程式語言。JavaScript是一門基於原型、
函式先行的語言[9],是一門多範式的語言,
它支援物件導向程式設計,指令式程式設計,
以及函式語言程式設計。
<br>
<br>
<a href="#">回頂端</a>
<hr>
<img src="../練習作業/images/jQ.jpg" alt="jQuery" id="jQuery" width="200" >
<h1><p>jQuery-JavaScript函式庫</p></h1>
<br>
jQuery是一套跨瀏覽器的JavaScript函式庫,簡化HTML與JavaScript之間的操作。
全球前10,000個存取最高的網站中,有65%使用了jQuery,是目前最受歡迎的JavaScript函式庫。
<br>
<br>
<a href="#">回頂端</a>
<hr>
<img src="../練習作業/images/BS.jpg" alt="Bootstrap" id="Bootstrap" width="200">
<br>
<h1><p>Bootstrap-CSS UI 框架</p></h1>
<br>
Bootstrap是一組用於網站和網路應用程式開發的開源前端(所謂「前端」,指的是展現給終端使用者的介面。與之對應的「後端」是在伺服器上面執行的代碼)框架,包括HTML、CSS及JavaScript的框架,提供字體排印、表單、按鈕、導航及其他各種元件及Javascript擴充套件,旨在使動態網頁和Web應用的開發更加容易。
<br>
<br>
<a href="#">回頂端</a>
<hr>
<table width="600" align="center" border="1" >
<caption><h3>座位表</h3></caption>
<tr>
<td colspan="4" align="center">老師的位置</td>
</tr>
<tr align="center">
<td>4號</td>
<td>3號</td>
<td>2號</td>
<td>1號</td>
</tr>
<tr align="center">
<td>8號</td>
<td>7號</td>
<td>6號</td>
<td>5號</td>
</tr>
<tr align="center">
<td>12號</td>
<td>11號</td>
<td>10號</td>
<td>9號</td>
</tr>
<tr align="center">
<td>16號</td>
<td>15號</td>
<td>14號</td>
<td>13號</td>
</tr>
<tr align="center">
<td>20號</td>
<td>19號</td>
<td>18號</td>
<td>17號</td>
</tr>
<tr align="center">
<td>24號</td>
<td>23號</td>
<td>22號</td>
<td>21號</td>
</tr>
</table>
</body>
</html>