首頁 > 開發者 > JavaScript
html 基礎(1)，html基礎
html5文檔聲明：<!doctype html>
<head>
在head元素可以插入指令碼script，樣式檔案css，各種meta資訊
可以添加在頭部地區的標籤元素有<title>,<style>,<meta>,<link>,<script>,<noscript>,<base>
<title>
定義瀏覽器工具列中的標題
提供頁面被添加到收藏夾時的標題
顯示在搜尋引擎結果中的頁面標題
<meta>
定義頁面編碼，utf-8多國語言編碼，gb2312中文簡體編碼
<meta charset="utf-8"/>
定義文檔關鍵詞，用於搜尋引擎
<meta name="keywords" content="關鍵字1,關鍵字2...">
定義web頁面描述
<meta name="description" content="內容介紹">
定義頁面作者
<meta name="author" content="zhuang">
每30秒重新整理頁面
<meta http-equiv="refresh" content="30">
<link>
定義文檔與外部資源的關係，常見的用途是連結樣式表
<link rel="stylesheet" type="text/css" href="zhuang.css">
<p>
<p>這是一個段落</p>
<br />
分行符號<br />
<h1> - <h6>
<h1>這是標題 1</h1><h2>這是標題 2</h2><h3>這是標題 3</h3><h4>這是標題 4</h4><h5>這是標題 5</h5><h6>這是標題 6</h6>
實體字元
空格： ；小於符號：<；大於符號：>；雙引號：&quto；單引號：&apos；&符號：&；著作權：©；註冊商標：®；
文字格式設定化
<b> 定義粗體字<em> 定義著重文字<i> 定義斜體字<big> 定義大號字<small> 定義小號字<strong> 定義加重語氣<sub> 定義下標字<sup> 定義上標字<ins> 定義插入字<del> 定義刪除字
<a>連結
<a href="url" title=" " target=" ">這是一個連結</a>
title 提示資訊
target 開啟檔案：
_blank 在新視窗中開啟被連結文檔
_self 在相同的架構中開啟被連結文檔
_parent 在父框架組中開啟被連結文檔
_top 在整個視窗中開啟被連結文檔
<a href="mailto:郵箱地址">郵件連結</a><a href="tel:電話號碼">一鍵撥打</a><a href="sms:電話號碼">一鍵傳送簡訊</a>
./ 目前的目錄
../ 回到上一層目錄
images/ 進入一層目錄
../images/ 回到上一層目錄，然後進入images目錄
錨點
常用於目錄，頁面內容定位，回到頂部
<a href="#錨的名稱"> </a><a name="錨的名稱"> </a>
用id屬性代替name屬性命名錨同樣有效
<img>映像
<img src="url" alt=" " title=" " width=" " height=" "/>
alt 映像載入失敗時顯示的資訊
title 滑鼠移到映像上提示的資訊
width，height 定義映像的寬度和高度，只定義其中一個的話另一個會按比例自動調整
映像熱區
<img src="url" usemap="#zhuang"/><map name="zhuang"> <area shape=" " coords=" " href="url"/></map>
shape 熱區形狀，rect（矩形），circle（圓形），poly（多邊形）
coords 形狀的座標值：
x1，y1，x2，y2：如果shape屬性值為rect，則該值規定矩形左上方和右下角的座標
x，y，radius：如果shape屬性值為circle，則該值規定圓心的座標和半徑
x1，y1，x2，y2，...，xn，yn：如果shape屬性值為poly，則該值規定多邊形各邊的座標
<ul>無序列表
<ul type=" "> <li>1</li> <li>2</li> <li>3</li></ul>
type類型有disc（實心圓），circle（空心圓），square（實心方塊）
type="none"，去到前面的列表符號
<ol>有序列表
<ol type=" " start=" " reversed> <li>1</li> <li>2</li> <li>3</li></ol>
type類型有1（阿拉伯數字），a（小寫字母），A（大寫字母），i（小寫羅馬字母），I（大寫羅馬字母）
start="5"，定義列表序號從第5個開始
reversed，定義列表序號為降序
<dl>自訂欄表
<dl><dt>Coffee</dt><dd>- black hot drink</dd><dt>Milk</dt><dd>- white cold drink</dd></dl>
<table>表格
<table> 定義表格
<th> 定義表格的表頭
<tr> 定義表格的行
<td> 定義表格單元
width 定義表格的寬度 px，%
height 定義表格的高度 px，%
border 定義表格邊框的寬度
cellpadding 定義邊框與內容之間的間距
cellspacing 定義儲存格之間的間距
align 定義對齊 left，right，center
valign 定義垂直相片順序 top，middle，bottom
colspan 定義合并列儲存格
rowspan 定義合并行儲存格
<table width="300px" height="90px" border="0" cellpadding="0" cellspacing="1" bgcolor="black"> <tr height="33.3%"> <td width="33.3%" rowspan="2" bgcolor="green"></td> <td width="33.3%" colspan="2" bgcolor="blue"></td> </tr> <tr heigh="33.3%"> <td width="33.3%" bgcolor="red"></td> <td width="33.3%" rowspan="2" bgcolor="yellow"></td> </tr> <tr heigh="33.3%"> <td width="33.3%" colspan="2" bgcolor="purple"></td> </tr></table>
border="0",cellspacing="1"可以設定表格的細線邊框
<iframe>內嵌架構
width 定義架構的寬度 px，%
height 定義架構的高度 px，%
frameborder 定義是否顯示邊框 1，0
scrolling 定義是否顯示捲軸 yes，no，auto
iframe可用作連結的目標，連結的target屬性必須引用iframe的name屬性
<iframe src="http://www.cnblogs.com" name="zhuang"> </iframe><a href="http://www.baidu.com" target="zhuang">百度</a>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
