頁面的主題標記--body
阿新 • • 發佈：2018-11-07
頁面主題標記--body
1，設定頁面背景色--bgcolor
語法：<body bgcolor="#3399CC">
2，設定背景圖片--background
語法：<body background="20160304428.jpg">
如果希望背景不重複顯示，藉助css在頭部中新增style標記。
<html> <head> <title>背景圖片</title> <style type="text/css"> body{back-ground-repeat:no-repeat} //no-repeat:不重複 //repeat-x:水平方向平鋪 //repeat-y:垂直方向平鋪 </style> </head> <body background="20160304428.jpg"> </body> </html>
設定背景圖片是否變化，通過bgproperties引數來設定,將bgproperties的值設為fixed,此時當拖動滾條時，就只有文字在動，背景是不變的。
<html>
<head>
<title>背景圖片</title>
</head>
<body background="20160304428.jpg" bgproperties=fixed>
</body>
</html>3，設定文字顏色--text
在沒有對文字顏色進行單獨的定義時，這一屬性對頁面中所有的文字都起作用。
<html>
<head>
<title>文字顏色</title>
</head>
<body bgcolor="#99CCCC" text="FF0000">
設定頁面的文字顏色
</body>
</html>4，設定連結文字屬性--link
在預設情況下，瀏覽器以藍色作為超連結文字的顏色；訪問過的文字則變為暗紅色。使用者在創作網頁時，可以通過link引數修改連結文字的顏色。
程式碼：link與body標籤放在一起，對網頁中所有未單獨設定的元素起作用，連結的顏色不是預設顏色了，變成了#CC66CC(紫色)。
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>頁面的連結文字</title>
</head>
<body link="#CC66CC">
<center>設定文字的連結效果
<br><br>
<a href="https://hao.360.cn/">連結文字</a>
<br><br>
</center>
</body>
</html>效果圖：
程式碼：在前程式碼的基礎上，新增正在訪問的文字顏色設定。這一屬性需要用到alink引數，執行以下程式碼時，單擊連結文字“正在訪問的連結”，會發現按下滑鼠時，文字顏色變成了#FFFF00（黃色）。
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>頁面的連結文字</title>
</head>
<body link="#CC66CC" alink="#FFFF00">
<center>設定文字的連結效果
<br><br>
<a href="https://hao.360.cn/">連結文字</a>
<br><br>
<a href="https://hao.360.cn/">正在訪問的連結<a>
</center>
</body>
</html>效果圖：
程式碼：在前程式碼的基礎上，新增 vlink引數設定訪問後的文字連結顏色，執行以下程式碼時，單擊連結文字“正在訪問的連結”，會發現按下滑鼠後，文字顏色變成了#00CC00（綠色）。
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>頁面的連結文字</title>
</head>
<body link="#CC66CC" alink="#FFFF00" vlink="#00CC00">
<center>設定文字的連結效果
<br><br>
<a href="https://hao.360.cn/">連結文字</a>
<br><br>
<a href="https://hao.360.cn/">已訪問過的連結</a>
</center>
</body>
</html>效果圖：
5，設定邊距--margin
用於定義頁面的空白，也就是內容與瀏覽器之間的距離，其中包括上邊框和左邊框。在預設情況下，邊距的值以畫素為單位。
語法：<body topmargin=上邊距的值 leftmargin=左邊距的值>
程式碼：
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>設定邊距</title>
</head>
<body>
設定上邊距為60畫素
<br>
設定左邊距為40畫素
</body>
</html>效果圖：
程式碼：
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>設定邊距</title>
</head>
<body topmargin=60 leftmargin=40>
設定上邊距為60畫素
<br>
設定左邊距為40畫素
</body>
</html>效果圖：
