HTML基本標籤的使用與注意事項

歡歡**發表於2020-09-29
HTML

<>     

表明這是一個標籤

""

表明這是一個屬性值

基本標籤

 標題標籤

h1-h6  (表示不同的字型大小，從右向左依次遞減

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>標題標籤</title>
	</head>
	<body>
		<h1>今天星期天</h1>
		<h2>今天星期天</h2>
		<h3>今天星期天</h3>
		<h4>今天星期天</h4>
		<h5>今天星期天</h5>
		<h6>今天星期天</h6>
	</body>
</html>

他的結果為：

段落標籤

<p></p>

      這是一個換行標籤，而且他還是雙標籤

如果不加入換行標籤的話，會顯示成以下形式

 

所以在需要換行的時候，一定要加上換行標籤

<br/>這是一個換行標籤，是一個單標籤

這兩個的換行是有一定的間距大小。

<hr/>是一條水平線，單標籤

可以看到他比上圖多了一條水平線，這就是<hr/>標籤的作用

文字標籤

<strong></strong>

   這是一個雙標籤，起到加粗的作用

可以看到今天是晴天比其他的字型黑

<b></b>

起到加粗的作用

<em></em>

起到斜體的作用

可以看到  不，今天是雨天變成了斜體

<i></i>

起到斜體的作用

可以看出  今天天氣怎麼樣，也變成了斜體

特殊字元/轉義字元（因為一些特殊字元有其自動識別功能，所以需要對其進行轉換）

<

  (&lt;)

如2<3 可以寫成以下格式

他就會執行出結果，如下圖：

>

(&gt;)

如3>2可以寫出如下結果：

空格：&nbsp;

我們可以看到第11行中打了很多的空格，對其執行結果如下圖：

我們可以看出，他並沒有顯示出我們預想的空格個數

因此，我們需要用&nbsp;來實現

我們可以看出第10行和第11行&nbsp的個數不一樣，其顯示結果為：

可以看出空格的長度與&nbsp;有一定的關係

版權符號  &copy;

其執行結果為：

圖片標籤

首先將你的圖片放置在所在資料夾的img下,如下圖：

其次在<body></body>裡面寫入【<img src="img/圖片名稱.jpg"/>】

就可以執行出想要的圖片的結果了。

 

 

 

 

 

 

 

 

 

相關文章