HTML元素
- HTML基本區塊
- HTML元素
- HTML元素有始有終
- HTML可以嵌套
<p><b>Hello, World</b></p> - HTML使用小寫
HTML文檔格式標籤
- 標題檢籤
<h#></h#>- 更題的重要性(搜索的問題)
- 瀏覽器會在標題前後添加空行
- HTML水平線
<hr/>，兩個本文之間有空隙 - HTML換行
<br/>，兩個本文之間沒有空隙 - HTML中的特殊符號
- <
><<&&空格 
- <
HTML屬性
- 表現各標籤的特徵
<img>中的src即為屬性
- 屬性都是以「屬性名=值」的形式出現
- 屬性的值建議用引號起來
- 屬性建議均以鍵值對的形式起來
- 一個標籤可有多個屬性，用空格分開
HTML圖像
- 語法
<img src="URL"/>
alt屬性(顯示圖片內容)border屬性(圖片外側相框寬度，默認像素)width屬性height屬性- 相對路徑
練習：文字&圖片
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<html>
<head>
<title>這是可愛鼠鼠的網頁</title>
</head>
<body>
<h1>快來看，可愛的小鼠鼠喲~</h1>
<img src="1.jpg" title="我是小鼠" border="1px"/>
<h2>這是一個非常可愛的小松鼠，CUTE~~~</h2>
<hr/>
Hello, World<br/>
Hello, World<br/>
<font size="5" color="green" face="仿宋">跳樓瘋搶呀!</font>只需<font size="8" color="red">1</font>元，美女抱回家~~<br/>
<!-- 5>3 2<8 -->
5>3 2<8</br>
&&&&& <!-- &符號 -->
</body>
</html>
練習：HTML常用的標籤
b粗體i斜體u底線s刪除線- Code標籤
<pre><code>程式碼</code></pre>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<html>
<head>
<title>HTML常用的標籤</title>
</head>
<body>
<b>這是要顯示在網頁中的內容</b><br/><!--b粗體本文-->
<i>這是要顯示在網頁中的內容</i><br/><!--i義大利斜體-->
<tt>這是要顯示在網頁中的內容</tt><br/><!--tt打字機本文-->
<u>這是要顯示在網頁中的內容</u><br/><!--u底線-->
<s>這是要顯示在網頁中的內容</s><br/><!--s刪除線-->
3<sup>2</sup>+4<sup>2</sup>=5<sup>2</sup><!--上標-->
3<sub>2</sub>+4<sub>2</sub>=5<sub>2</sub><!--下標-->
<!-- 程式碼 -->
<pre>
<code>
for(i=0; i<5; i++) {
Console.WriteLine("Hello");
}
</code>
</pre>
</body>
</html>
Code標籤
<pre><code>程式碼</code></pre>
1
2
3
4
5
6
7
<pre>
<code>
for(i=0; i<5; i++) {
Console.WriteLine("Hello");
}
</code>
</pre>
marquee圖片移動
很少在用了，因為很多瀏覽器不兼容了
1
2
<!-- marquee圖片移動 direction移動方向 behavior行為slide滑動完固定在右邊-->
<marquee direction="right" behavior="slide"><img src="1.jpg" /></marquee>
用來顯示元素的移動
direction屬性：設置方向
- left, right, down, up
behavior屬性：設置模式
- scroll, altermate, slide