HTML+CSS 輕松入門(mén)之HTML基礎(chǔ)標(biāo)簽（一）

html 中的注釋

HTML種標(biāo)簽有很多，大家可以參考手冊(cè),接下來(lái)我們講解一些我們常用的標(biāo)簽

首先我們來(lái)講P標(biāo)簽段落（p）

<!DOCTYPE html>
<html>
<head>
	<title></title>
</head>
<body>
		<p>大家好</p>
</body>
</html>

然后我們?cè)跒g覽器上運(yùn)行，輸出：大家好

看以下代碼：

<!DOCTYPE html>
<html>
<head>
	<title></title>
</head>
<body>
		<p>大家好</p>
		<p>大家好！</p>
</body>
</html>

段落會(huì)自己換行，所以輸出：

大家好

<meta>-----是head 標(biāo)簽內(nèi)的一個(gè)輔助標(biāo)簽，通常用來(lái)設(shè)置編碼，以及優(yōu)化推廣的關(guān)鍵詞關(guān)鍵字等

<br> -------換行

<font>---------給文字格式化

<table>------表格

<span>------行內(nèi)標(biāo)簽

提示和注釋?zhuān)?/p>

提示：請(qǐng)使用 <span> 來(lái)組合行內(nèi)元素，以便通過(guò)樣式來(lái)格式化它們。

注釋?zhuān)簊pan 沒(méi)有固定的格式表現(xiàn)。當(dāng)對(duì)它應(yīng)用樣式時(shí)，它才會(huì)產(chǎn)生視覺(jué)上的變化。

<h1>到<h6>-----控制字體大小

<div>-------把文檔分割為獨(dú)立的、不同的部分（等學(xué)到css 我們會(huì)講解）

<hr>-------被水平線分隔的標(biāo)題和段落

接下來(lái)我們先講解這些簡(jiǎn)單的標(biāo)簽

如下代碼：

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
</head>
<body>
		<p>大家好<span>123456</span></p>
		<p>大家好</p>
		
		111111111111111<br>1111111111111111 <!--換行-->

		<hr>  <!--用來(lái)和以上隔開(kāi)，有一條黑色的直線-->

		<font size='18' color="red">我們都一樣</font>   <!--font設(shè)置字體大小，顏色-->

		<hr>

		<h1>中國(guó)</h1>
		<h2>中國(guó)</h2>
		<h3>中國(guó)</h3>
		<h4>中國(guó)</h4>
		<h5>中國(guó)</h5>
		<h6>中國(guó)</h6>

</body>	
</html>

大家把代碼拷貝到自己的電腦上，創(chuàng)建文件，后綴為.html 然后雙擊預(yù)覽

表格

大家請(qǐng)看以下代碼：

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
</head>
<body>
		<table>
			<tr>
				<th>美國(guó)</th>
				<th>日本</th>
				<th>中國(guó)</th>
			</tr>

			<tr>
				<td>123</td>
				<td>456</td>
				<td>789</td>
			</tr>

			<tr>
				<td>123</td>
				<td>456</td>
				<td>789</td>
			</tr>
		</table>
</body>
</html>

表格的構(gòu)成是由行和列準(zhǔn)確的說(shuō)不能叫列，只能叫單元格

以上代碼中的<tr>標(biāo)簽代表行 <td>代表單元格但是我們?cè)陬A(yù)覽中是以表格的形式展示，所以稱(chēng)為3行3列

<th> 定義表頭單元格，一般用于標(biāo)題上，例如我們做一個(gè)星期的日程表星期一到星期天，這些字需要加粗等

以上代碼運(yùn)行結(jié)果：

美國(guó) 日本中國(guó)

123 456 789

這樣的表格我們看的有點(diǎn)不習(xí)慣，那么我來(lái)給表格加邊框

以上代碼中。我們?cè)趖able 標(biāo)簽中加入border='1' 然后我們給表格加一個(gè)寬度和高度 width="300" height="200"

具體代碼如下：

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
</head>
<body>
		<table border="1" width="300" height="200">
			<tr>
				<th>美國(guó)</th>
				<th>日本</th>
				<th>中國(guó)</th>
			</tr>

			<tr>
				<td>123</td>
				<td>456</td>
				<td>789</td>
			</tr>

			<tr>
				<td>123</td>
				<td>456</td>
				<td>789</td>
			</tr>
		</table>
</body>
</html>

Weiter lernen

neue Datei

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <table border="1" width="300" height="200"> <tr> <th>美國(guó)</th> <th>日本</th> <th>中國(guó)</th> </tr> <tr> <td>123</td> <td>456</td> <td>789</td> </tr> <tr> <td>123</td> <td>456</td> <td>789</td> </tr> </table> </body> </html>

einreichen Code zurücksetzen

Automatische Operation