HTML+CSS 輕鬆入門之H...登入

HTML+CSS 輕鬆入門之HTML基礎標籤(二)

超連結

格式:<a href=''></a>

如下實例:

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
</head>
<body>
		<a href="php.cn">php中文网</a>
</body>
</html>

註:href 是a標籤不可少的屬性  href="連結到的地方",如百度,淘寶等

#什麼是空連結

寫空連接用#  鍵

程式碼如下:

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
</head>
<body>
		<a href="#">php中文网</a>
</body>
</html>

這樣,我們點選連結是沒有反應的

如何使用css樣式標籤

<style></style>

註:樣式的標籤是寫在頭部檔案中,程式碼如下

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
	<style type="text/css">
			/*写入css样式*/
	</style>
</head>
<body>
		欢迎来到php中文网
</body>
</html>

註:type 屬性是必要的,定義style 元素的內容。唯一可能的值是 "text/css"。

寫入腳本程式碼也是一樣:

如下程式碼所示

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
	<script type="text/javascript">
			//写入脚本代码
	</script>
</head>
<body>
		欢迎来到php中文网
</body>
</html>

type 屬性規定腳本的類型

##圖片標籤

<img>標籤 如下程式碼所示:

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
</head>
<body>
		欢迎来到php中文网
		<img src="images/1.jpg">
</body>
</html>

如果存在這張圖片,我們將會吧這張圖片顯示出來


引入外部樣式或腳本

#引入外部樣式,例如我建立一個style.css的文件,我現在的頁面要用到style.css這個文件中的樣式

如下程式碼所示:

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
	<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
		欢迎来到php中文网
</body>
</html>

這樣我們就已經把樣式引入進來了

引入外本腳本檔案

如下程式碼所示:

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
	<script type="text/javascript" src="index.js"></script>
</head>
<body>
		欢迎来到php中文网
</body>
</html>


下一節

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> /*写入css样式*/ </style> </head> <body> 欢迎来到php中文网 </body> </html>
章節課件