HTML+CSS CSS3 特殊的“邊線”outline

utline與border的異同：

邊框的設定在web設計中使用率非常的高，border:1px solid #00f;屬于標準的邊線寫法，也可以實現單方向邊線border-left:1px solid red;

1px red solid邊線

（單邊線）左邊線

在CSS標準盒模型中，邊線border是計算在容器總寬度和高度之中的，

總寬高是102*102

瀏覽器中呈現的總寬度和總高度102*102

但隨著web布局要求越來越高，自適應布局應用逐漸廣泛，橫向排布四個div 各占據四分之一的寬度，但如果某一個要有邊線border修飾，因為border是占據寬度的，最終會導致最后一個元素掉下來，因為實際寬度大于了總寬度。

各占據四分之一的寬度

第四個元素掉了下來

outline可以實現和border相同的效果，標準語法也基本相同(outline:1px solid red)，也支持outline-style，outline-width，outline-color等分散屬性。

但是outline不占位，不會增加元素的寬高。

outline使用，總寬高不變還是100*100

outline標準寫法

outline缺點：

①不支持圓角 outline-radius:3px;

②不支持單方向outline。

不支持部分屬性

outline在文本框中的作用：

默認的文本框input[type="text"]獲取光標時會有邊線高亮。

文本框高亮獲取光標（新版本之前是藍色邊線）

實際上高亮的部分為outline在起作用

.text:focus{outline: 3px solid #00f;}

使用outline:none，可以去除默認文本框獲取光標時出現的邊線

outline：none

.outline{
		/*標準寫法*/
		outline:1px solid red;
		/*單方向邊線*/
		outline-left:4px solid #000; 
	}
	.outline:focus{
		/*去除默認邊線*/
		outline: none;
	}

outline作為一個特殊的屬性存在，在特殊的場景中會產生很棒的效果，靈活使用才能發揮出最大作用。

TML基礎知識

學習目標

能夠知道html的作用
能夠寫出html的基本結構
能夠知道單標簽和雙標簽的區別
知道相對路徑和絕對路徑的區別
掌握標簽的種類
了解表格的邊線合并
了解表單中常用的表單元素標簽
了解表單的提交方式
了解表單中action屬性的作用

一、HTML的介紹

1. 網頁效果圖 -- 百度

2. html的定義

HTML 的全稱為：HyperText Mark-up Language, 指的是超文本標記語言。

標記：就是標簽, <標簽名稱> </標簽名稱>, 比如: <html></html>、<h1></h1>等，標簽大多數都是成對出現的。

所謂超文本，有兩層含義:

因為網頁中還可以圖片、視頻、音頻等內容(超越文本限制)
它還可以在網頁中跳轉到另一個網頁，與世界各地主機的網頁鏈接(超鏈接文本)

3. html的作用

html是用來開發網頁的，它是開發網頁的語言。

二、html 的基本結構

1. 結構代碼

<!DOCTYPE html>
<html>
    <head>            
        <meta charset="UTF-8">
        <title>網頁標題</title>
    </head>
    <body>
          網頁顯示內容
    </body>
</html>

第一行<!DOCTYPE html>是文檔聲明, 用來指定頁面所使用的html的版本, 這里聲明的是一個html5的文檔。
<html>...</html>標簽是開發人員在告訴瀏覽器，整個網頁是從<html>這里開始的，到</html>結束,也就是html文檔的開始和結束標簽。
<head>...</head>標簽用于定義文檔的頭部,是負責對網頁進行設置標題、編碼格式以及引入css和js文件的。
<body>...</body>標簽是編寫網頁上顯示的內容。

2. 瀏覽網頁文件

網頁文件的后綴是.html或者.htm, 一個html文件就是一個網頁，html文件用編輯器打開顯示的是文本，可以用文本的方式編輯它，如果用瀏覽器打開，瀏覽器會按照標簽描述內容將文件渲染成網頁。

3. 小結

三、初始常用的 html 標簽

1. 常用的 html 標簽

<!-- 1、成對出現的標簽：-->

<h1>h1標題</h1>
<div>這是一個div標簽</div>
<p>這個一個段落標簽</p>


<!-- 2、單個出現的標簽： -->
<br>
<img src="images/pic.jpg" alt="圖片">
<hr>

<!-- 3、帶屬性的標簽，如src、alt 和 href等都是屬性 -->
<img src="images/pic.jpg" alt="圖片">
<a href="http://www.baidu.com">百度網</a>

<!-- 4、標簽的嵌套 -->
<div>
    <img src="images/pic.jpg" alt="圖片">
    <a href="http://www.baidu.com">百度網</a>
</div>

提示:

標簽不區分大小寫，但是推薦使用小寫。
根據標簽的書寫形式，標簽分為雙標簽(閉合標簽)和單標簽(空標簽) 2.1 雙標簽是指由開始標簽和結束標簽組成的一對標簽，這種標簽允許嵌套和承載內容，比如: div標簽 2.2 單標簽是一個標簽組成，沒有標簽內容，比如: img標簽

2.標簽列表

標簽	描述
<!--...-->	定義注釋
<!DOCTYPE>	定義文檔類型
<a>	定義超文本鏈接
<abbr>	定義縮寫
<acronym>	定義只取首字母的縮寫，不支持HTML5
<address>	定義文檔作者或擁有者的聯系信息
<applet>	HTML5中不贊成使用。定義嵌入的 applet。
<area>	定義圖像映射內部的區域
<article>	定義一個文章區域
<aside>	定義頁面的側邊欄內容
<audio>	定義音頻內容
<b>	定義文本粗體
<base>	定義頁面中所有鏈接的默認地址或默認目標。
<basefont>	HTML5不支持，不贊成使用。定義頁面中文本的默認字體、顏色或尺寸。
<bdi>	允許您設置一段文本，使其脫離其父元素的文本方向設置。
<bdo>	定義文字方向
<big>	定義大號文本，HTML5不支持
<blockquote>	定義長的引用
<body>	定義文檔的主體
<br>	定義換行
<button>	定義一個點擊按鈕
<canvas>	定義圖形，比如圖表和其他圖像,標簽只是圖形容器，您必須使用腳本來繪制圖形
<caption>	定義表格標題
<center>	HTML5不支持，不贊成使用。定義居中文本。
<cite>	定義引用(citation)
<code>	定義計算機代碼文本
<col>	定義表格中一個或多個列的屬性值
<colgroup>	定義表格中供格式化的列組
<command>	定義命令按鈕，比如單選按鈕、復選框或按鈕
<datalist>	定義選項列表。請與 input 元素配合使用該元素，來定義 input 可能的值。
<dd>	定義定義列表中項目的描述
<del>	定義被刪除文本
<details>	用于描述文檔或文檔某個部分的細節
<dfn>	定義定義項目
<dialog>	定義對話框，比如提示框
<dir>	HTML5不支持，不贊成使用。定義目錄列表。
<div>	定義文檔中的節
<dl>	定義列表詳情
<dt>	定義列表中的項目
<em>	定義強調文本
<embed>	定義嵌入的內容，比如插件。
<fieldset>	定義圍繞表單中元素的邊框
<figcaption>	定義<figure> 元素的標題
<figure>	規定獨立的流內容（圖像、圖表、照片、代碼等等）。
<font>	HTML5不支持，不贊成使用。定義文字的字體、尺寸和顏色。
<footer>	定義 section 或 document 的頁腳。
<form>	定義了HTML文檔的表單
<frame>	定義框架集的窗口或框架
<frameset>	定義框架集
<h1> to <h6>	定義 HTML 標題
<head>	定義關于文檔的信息
<header>	定義了文檔的頭部區域
<hr>	定義水平線
<html>	定義 HTML 文檔
<i>	定義斜體字
<iframe>	定義內聯框架
<img>	定義圖像
<input>	定義輸入控件
<ins>	定義被插入文本
<kbd>	定義鍵盤文本
<keygen>	規定用于表單的密鑰對生成器字段。
<label>	定義 input 元素的標注
<legend>	定義 fieldset 元素的標題。
<li>	定義列表的項目
<link>	定義文檔與外部資源的關系
<main>	定義文檔的主體部分。
<map>	定義圖像映射
<mark>	定義帶有記號的文本。請在需要突出顯示文本時使用 <em> 標簽。
<menu>	不贊成使用。定義菜單列表。
<meta>	定義關于 HTML 文檔的元信息。
<meter>	定義度量衡。僅用于已知最大和最小值的度量。
<nav>	定義導航鏈接的部分
<noframes>	定義針對不支持框架的用戶的替代內容。HTML5不支持
<noscript>	定義針對不支持客戶端腳本的用戶的替代內容。
<object>	定義內嵌對象
<ol>	定義有序列表。
<optgroup>	定義選擇列表中相關選項的組合。
<option>	定義選擇列表中的選項。
<output>	定義不同類型的輸出，比如腳本的輸出。
<p>	定義段落。
<param>	定義對象的參數。
<pre>	定義預格式文本。
<progress>	定義運行中的進度（進程）。
<q>	定義短的引用。
<rp>	<rp> 標簽在 ruby 注釋中使用，以定義不支持 ruby 元素的瀏覽器所顯示的內容。
<rt>	<rt> 標簽定義字符（中文注音或字符）的解釋或發音。
<ruby>	<ruby> 標簽定義 ruby 注釋（中文注音或字符）。
<s>	不贊成使用。定義加刪除線的文本。
<samp>	定義計算機代碼樣本。
<script>	定義客戶端腳本。
<section>	<section> 標簽定義文檔中的節（section、區段）。比如章節、頁眉、頁腳或文檔中的其他部分。
<select>	定義選擇列表（下拉列表）。
<small>	定義小號文本。
<source>	<source> 標簽為媒介元素（比如 <video> 和 <audio>）定義媒介資源。
<span>	定義文檔中的節。
<strike>	HTML5不支持，不贊成使用。定義加刪除線文本。
<strong>	定義強調文本。
<style>	定義文檔的樣式信息。
<sub>	定義下標文本。
<summary>	<summary> 標簽包含 details 元素的標題，"details" 元素用于描述有關文檔或文檔片段的詳細信息。
<sup>	定義上標文本。
<table>	定義表格。
<tbody>	定義表格中的主體內容。
<td>	定義表格中的單元。
<textarea>	定義多行的文本輸入控件。
<tfoot>	定義表格中的表注內容（腳注）。
<th>	定義表格中的表頭單元格。
<thead>	定義表格中的表頭內容。
<time>	定義日期或時間，或者兩者。
<template>	定義在頁面加載時隱藏的一些內容。
<title>	定義文檔的標題。
<tr>	定義表格中的行。
<track>	<track> 標簽為諸如 video 元素之類的媒介規定外部文本軌道。
<tt>	定義打字機文本。
<u>	不贊成使用。定義下劃線文本。
<ul>	定義無序列表。
<var>	定義文本的變量部分。
<video>	<video> 標簽定義視頻，比如電影片段或其他視頻流。
<wbr>	規定在文本中的何處適合添加換行符。

3.HTML 屬性

屬性	描述
accesskey	設置訪問元素的鍵盤快捷鍵。
class	規定元素的類名（classname）
contenteditable	規定是否可編輯元素的內容。
contextmenu	指定一個元素的上下文菜單。當用戶右擊該元素，出現上下文菜單
data-*	用于存儲頁面的自定義數據
dir	設置元素中內容的文本方向。
draggable	指定某個元素是否可以拖動
dropzone	指定是否將數據復制，移動，或鏈接，或刪除
hidden	hidden 屬性規定對元素進行隱藏。
id	規定元素的唯一 id
lang	設置元素中內容的語言代碼。
spellcheck	檢測元素是否拼寫錯誤
style	規定元素的行內樣式（inline style）
tabindex	設置元素的 Tab 鍵控制次序。
title	規定元素的額外信息（可在工具提示中顯示）
translate	指定是否一個元素的值在頁面載入時是否需要翻譯

4.小結

學習 html 語言就是學習標簽的用法，常用的標簽有20多個。
編寫 html 標簽建議使用小寫
根據書寫形式，html 標簽分為雙標簽和單標簽
單標簽沒有標簽內容，雙標簽可以嵌套其它標簽和承載文本內容

四、資源路徑

當我們使用img標簽顯示圖片的時候，需要指定圖片的資源路徑，比如:

<img src="images/logo.png">

這里的src屬性就是設置圖片的資源路徑的，資源路徑可以分為相對路徑和絕對路徑。

1. 相對路徑

從當前操作 html 的文檔所在目錄算起的路徑叫做相對路徑

示例代碼:

<!-- 相對路徑方式1 -->
<img src="./images/logo.png">
<!-- 相對路徑方式2 -->
<img src="images/logo.png">

2. 絕對路徑

從根目錄算起的路徑叫做絕對路徑，Windows 的根目錄是指定的盤符，mac OS 和Linux 是/

示例代碼:

<!-- 絕對路徑 -->
<img src="/Users/apple/Desktop/demo/hello/images/logo.png">
<img src="C:\demo\images\001.jpg">

提示:

一般都會使用相對路徑，絕對路徑的操作在其它電腦上打開會有可能出現資源文件找不到的問題

五、列表標簽

1. 列表標簽的種類

無序列表標簽(ul標簽)
有序列表標簽(ol標簽)

2. 無序列表

<!-- ul標簽定義無序列表 -->
<ul>
    <!-- li標簽定義列表項目 -->
    <li>列表標題一</li>
    <li>列表標題二</li>
    <li>列表標題三</li>
</ul>

3. 有序列表

<!-- ol標簽定義有序列表 -->
<ol>
    <!-- li標簽定義列表項目 -->
    <li><a href="#">列表標題一</a></li>
    <li><a href="#">列表標題二</a></li>
    <li><a href="#">列表標題三</a></li>
</ol>

六、表格標簽

1. 表格的結構

表格是由行和列組成，好比一個excel文件

2. 表格標簽

<table>標簽：表示一個表格

<tr>標簽：表示表格中的一行

<td>標簽：表示表格中的列
<th>標簽：表示表格中的表頭

示例代碼:

<table border="1" cellspacing="3">
    <tr>
        <th>姓名</th>
        <th>年齡</th>
    </tr>
    <tr>
        <td>張三</td>
        <td>18</td> 
    </tr>
</table>

表格邊線合并:

border-collapse 設置表格的邊線合并，如：border-collapse:collapse;

七、表單標簽

1. 表單的介紹

表單用于搜集不同類型的用戶輸入(用戶輸入的數據)，然后可以把用戶數據提交到web服務器。

2. 表單相關標簽的使用

<form>標簽表示表單標簽，定義整體的表單區域
<label>標簽表示表單元素的文字標注標簽，定義文字標注
<input>標簽表示表單元素的用戶輸入標簽，定義不同類型的用戶輸入數據方式
type屬性
type="text" 定義單行文本輸入框
type="password" 定義密碼輸入框
type="radio" 定義單選框
type="checkbox" 定義復選框
type="file" 定義上傳文件
type="submit" 定義提交按鈕
type="reset" 定義重置按鈕
type="button" 定義一個普通按鈕
<textarea>標簽表示表單元素的多行文本輸入框標簽定義多行文本輸入框
<select>標簽表示表單元素的下拉列表標簽定義下拉列表
<option>標簽與<select>標簽配合，定義下拉列表中的選項

示例代碼:

<form>
    <p>
        <label>姓名：</label><input type="text">
    </p>
    <p>
        <label>密碼：</label><input type="password">
    </p>
    <p>
        <label>性別：</label>
        <input type="radio"> 男
        <input type="radio"> 女
    </p>
    <p>
        <label>愛好：</label>
        <input type="checkbox"> 唱歌
        <input type="checkbox"> 跑步
        <input type="checkbox"> 游泳
    </p>
    <p>
        <label>照片：</label>
        <input type="file">
    </p>
    <p>
        <label>個人描述：</label>
        <textarea></textarea>
    </p>
    <p>
        <label>籍貫：</label>
        <select>
            <option>北京</option>
            <option>上海</option>
            <option>廣州</option>
            <option>深圳</option>
        </select>
    </p>
    <p>
        <input type="submit" value="提交">
        <input type="reset" value="重置">
    </p>
</form>

3. 小結

表單標簽是<form>標簽
常用的表單元素標簽有: <label>、<input>、<textarea> 、 <select>等標簽

八、表單提交

1. 表單屬性設置

<form>標簽表示表單標簽，定義整體的表單區域

action屬性設置表單數據提交地址
method屬性設置表單提交的方式，一般有“GET”方式和“POST”方式, 不區分大小寫

2. 表單元素屬性設置

name屬性設置表單元素的名稱，該名稱是提交數據時的參數名
value屬性設置表單元素的值，該值是提交數據時參數名所對應的值

3. 示例代碼

 <form action="https://www.baidu.com" method="GET">
    <p>
        <label>姓名：</label><input type="text" name="username" value="11" />
    </p>
    <p>
        <label>密碼：</label><input type="password" name="password" />
    </p>
    <p>
        <label>性別：</label>
        <input type="radio" name="gender" value="0" /> 男
        <input type="radio" name="gender" value="1" /> 女
    </p>
    <p>
        <label>愛好：</label>
        <input type="checkbox" name="like" value="sing" /> 唱歌
        <input type="checkbox" name="like" value="run" /> 跑步
        <input type="checkbox" name="like" value="swiming" /> 游泳
    </p>
    <p>
        <label>照片：</label>
        <input type="file" name="person_pic">
    </p>
    <p>
        <label>個人描述：</label>
        <textarea name="about"></textarea>
    </p>
    <p>
        <label>籍貫：</label>
        <select name="site">
            <option value="0">北京</option>
            <option value="1">上海</option>
            <option value="2">廣州</option>
            <option value="3">深圳</option>
        </select>
    </p>
    <p>
        <input type="submit" name="" value="提交">
        <input type="reset" name="" value="重置">
    </p>
</form>

4.小結

表單標簽的作用就是可以把用戶輸入數據一起提交到web服務器。
表單屬性設置

action: 是設置表單數據提交地址
method: 是表單提交方式，提交方式有GET和POST

表單元素屬性設置

name: 表單元素的名稱，用于作為提交表單數據時的參數名
value: 表單元素的值，用于作為提交表單數據時參數名所對應的值

、結構

一、標記<Html> 建立HTML文檔

<Head> 設置網頁頭部和其它信息

<Body> 設計文件格式及內文所在<Body> 元素的屬性

Text 設置頁面文字的送顔色 Bgcolor 設置頁面背景的顡色

Background 設置頁面的背景圖像 Link設置頁面黙認的顔色

Bgproperties 設置頁面的背景圖像為固定，不隨頁面的滾動而滾動

Alink 設置鼠標正在單擊時候的鏈接顔色 Vlink 設置訪問過后的鏈接顔色

Topmargin 設置頁面的上邊距 Leftmargin 設置頁面的左邊距

二、頭部

標記 <Base> 當前文檔的URL全稱 <Title>設置顯示在瀏覽器在上方的標題內容

<Isindex> 表明該文檔是一個可用于檢索的網關腳本

<Meta> 有關文檔本身的信息，例如用于查詢的關鍵詞，用于獲取該文檔的有效期等

<Style> 設置CSS層疊樣式表的內容

<Mate> 標記屬性

Http-Equiv 生成一個HTTP標題域，它的取值與另一個屬性相同，

例如Http-Equiv=Expires，實際取值由Content確定

Name 如果元數據是以關鍵字/取值的形式出現的，Name 表示鍵字,

如Author或ID

Content 關鍵字/取值的內容

三、文字

文字標記 <HNumber>……<1HNumber> Number=1.2.3.4.5.6

分別指1至6級標題

<Font>文字

文字的修飾標記 <B>/<strong> 粗體 <I>/<Em>/<cite> 斜體

<Sup>上標 <sub>下標 <Big>大字號 <small>小字號

<U>下劃線 <S>/<strike>刪除線 <Address>地址

<Tt>打字機文字 <Blink>閃爍文字（只適用于Netscape瀏覽器）

<Code>/<samp>等寬 <kbd>鍵盤輸入文字 <Var>聲明變量

<Fant>標記的屬性

Face 字體 Size字號 Color顔色

四.列表

列表標記 <Ul>無序列表 <Ol>有序列表 <Dir>回錄列表 <Dl>定義列表

<Meru>菜單列表 <Dt>·<Dd>定義列表的標記 <Li>列表項目的標記

<Ul><Ol>標記的屬性 Type設置列表類型 start設置列表起始屬性

Type的屬性值 1 數字 a 小寫字母 A 大寫字母 i小寫羅馬數字

I 大寫羅馬數字 Disc ● Circle ○ square □

五.鏈接

鏈接標記 <A> 鏈接

<A>標記的屬性 Href 指定鏈接地址 Name給鏈接命名

Title設置鏈接提示文字 Target指定鏈接的目標窗口

Target屬性值 -parent在上一級窗口中打開。一般使用分幀的框架頁會經常使用

-bank在新窗口中打開

-self在同一個幀或窗口中打開.這項一般不用設置

Href屬性值 http:// 進入萬維網站點 news://啟動新聞討論

ftp:// 進入文件傳輸服務器 mailto:// 啟動新聞討論組

telnet:// 啟動telnet方式 gopher://訪問一個gopher服務器

六.圖片

圖片標記 <Img>圖片 <Map>圖像映射 <Area>圖像映射中定義區域

<lmg>標記的屬性 src圖像的源文件 Alt提示文字 Width寬度

Height高度 Vspace垂直間距 Hspace水平間距 Align排列 Border邊框

Align屬性值 Top文字的中間線居于圖片上方 Middle文字的中間線居于圖片中間

Bottom文字的中間線居于圖片底部 Left 圖片在文字的左側

Right圖片在文字的右側 Absbottom文字的底線居于圖片底部

Absmiddle文字的底線居于圖片中間 Baseline英文文字基線對齊

Texttop英文文字上邊線對齊

Shape屬性值

Rect矩形區域 Circle橢圓形區域 Poly多邊形區域

七.表格

1.表格標記 <Table>…</Table>表格標記 <Tr>…</Tr>行標記

<Td>…</Td>單元格標記 <Th>表頭標記

<Table>標記屬性 Bordercolor 表格邊框色 Borde表格邊框的寬度

Bordercolorlight 表格邊框亮邊框色（左上邊框顔色）

Bordercolordark 表格暗邊框色（右下邊框顔色）

Bordercolor 行的邊框顔色 Width表格的寬度 Height表格的高度

Bgcolor表格的背景顔色 Background表格的背圖像

<Tr>標記屬性 Align行內容的水平對齊 Valign 行內容的垂直對齊

Bgcolor 行的背景顔色 Background 行的背景圖像

Bordercolor 行的邊框顔色 Bordercolorlight 行的亮邊框顔色

Bordercolordark 行的暗邊框顔色

<Td>標記屬性 Align單元內容的水平對齊 Valign單元格內容的垂直對齊

Bgcolor 單元格的背景顔色 Background 單元格的背景圖像

Bordercolor單元格的背景顔色 Bordercorlorlight單元格的亮邊框顔色

Brodercolordark 單元格的暗邊框顔色 Width 單元格的寬度

Height單元格的高度

<Th>標記屬性 Align表頭內容的水平對齊 Valign表頭內容的垂直對齊

Bgcolor 表頭的背景顔色 Background表頭的背景圖像

Bordercolor表頭的邊框顔色 Bordercolorlight 表頭的亮邊框顔色

Bordercolordark 表頭的暗邊框顔色 Width 表頭的寬度 Height 表頭的高度

八.表單

1.表單標記 <Form>表單標記 <Input>表單輸入標記

<select>菜單和列表標記 <Option>菜單和列表項目標記

2.屬性 <Form> Name表單的名稱

Method 定義表單結果從瀏覽器傳送到服務器的方法，一般有兩種方法：get,post

Action 用來定義表單處理程序（一個Asp,CGI等程序）的位置（相對地址或絕對地址）

<lnput>標記屬性 Name 域的名稱 Type域的類型

Maxlength 域的最大輸入字符數 size域的寬度 Value 域的默認值

<Select>標記屬性 Name 菜單和列表的名稱 size 顯示的選項數目

Multiple 列表中的項目多選 Value 選項值 selected默認選項

<Texrarea>標記屬性 Name 文字域的名稱 Rows文字域的行數

Cols 文字域的列數 Value 文字域的默認值

Type屬性值 Text 文字域 Password 密碼域 File 文件域

Checkbox復選框 Redio單選框 Button普通按扭

Submit 提交按鈕 Reset重置按鈕 Hidden隱藏域Image圖像域

九.滾動

滾動標記 <Marquee>

<Marquee>標記屬性 Direction 滾動方向 up 文字向上滾動 Left文字向左滾動

Behavior 滾動方式 Scroll 循環往復

Side 只做一次滾動

Alternate 交替進行滾動

ScrollAmount 滾動速度

ScrollDelay 滾動延遲

Trim函數用來剔除首尾空格

十.框架

1.標記 <Frameset> 框架邊框標記 <Frame> 框架標記 <Iframe>浮動框架標記

<Frameset>標記屬性 Cols列 Rows行

<Frame> 標記屬性 src框架中顯示頁面源文件的路徑

FrameBorder 框架邊框顯標屬性 FrameSpacing框架邊框寬度屬性

Scrolling框架滾動條顯示屬性 NoResize 框架尺寸調整屬性

BorderColor 框架邊框顔色屬性 MarginWidt 框架邊框緣寬度屬性

MarginHerght框架邊緣高度屬性

<1frame> 標記屬性 src浮動框架中顯示頁面源文件的路徑

Width 浮動框架的寬度 Height 浮動框架的高度

Name 浮動框架的名稱

Align 浮動框架的排列方式 Left表示居左 Center表示居中 Right表示居右

FrameBorder 框架邊框顯示屬性 FrameSpacing 框架寬度屬性

Scrolling 框架滾動條顯示屬性 ( yes顯示 No不顯示 Auto根據頁面的長度自動判斷是否晶粒示滾動條

NoResize 框架尺寸調整屬性 BorderColor框架的顔色

MarginWidth 框架邊緣寬度屬性 MarginHeight 框架邊緣高度屬性

插入刷新

步驟：1.選擇"查看/文件頭內容"

2.在插入面板上，打開HTML選項卡

優化代碼

打開文件窗口，執行"命令、清理HTML"命令

文本換行：Enter 行距較大

Enter + Shift 行距較小

插入水平線設置顔色：單擊屬性面板中的快捷標簽編輯器按鈕

在代碼中鍵入"color = #顔色值"

當圖像無法顯示時將顯示這段文字：

圖像屬性中的替代→輸入文字

插入鼠標經過圖像:準備兩張圖像

在文件窗口中，將光標放置于需要翻轉圖像位置→插入工具欄中單擊鼠標經過圖像

Ⅱ.使用導航條：

在"常用"對象組中，單擊"圖像"小三角→導航條

插入圖像占位符：圖像小三角→圖像占位符

Flash動畫的背景實現透明參數wmode 值 transparent

插入 Java Applet

插入表單

插入表單域：對象面板上"表單"→插入表單

插入文本域：單擊面板上的插入文本域. 初始值 = 打開時顯于的文字

插入密碼框：在屬性面板上選擇密碼

插入多行文本域：在類型后選擇多行

插入隱藏域：對象面板→插入隱藏域

插入按鈕：標簽用來設置按鈕上顯示的文本

插入圖像提交按鈕=圖像域：

插入文件上傳按鈕=文件域：

插入單選框

插入單選按鈕組：Label文字說明 Value 單選按鈕的值

插入復選框

菜單/插入列表：列表值→

插入跳轉菜單：(

制作網頁鏈接

URL統一資源定位器

目標：_blank在一個新的未命名的瀏覽器窗口中打開

_parent如果是嵌套的框架，鏈接會在父框架或窗口中打開，否則=_top

_top在完整的瀏覽器中打開

創建搜索頁

運行中輸入:

Inetmgr (IIS

Odbcad32 (odbc

Asp對象

Applicatipn 在給定的應用程序的所有用戶間共享信息,并在服務器運行期間持久地保存數據。

集合： Contents

staticObjects

Item（變量值）=設置資料變量的值

Key（變量名稱）=設置資料變量的名稱

Count（變量資料的數量）=表示

Coutents集合中資料的總數量

方法： Lock

Unlock

事件： Applicatipn_Onstart

Application_OnEnd

Session 存儲特定的用戶會話所需的信息

屬性：CodePage

LCID

SessionID

Timeout

集合：Contents

StaticObjects

方法：Abandon

事件：Session_Onstart

Session_OnEnd

Response 用來控制發送給用戶的信息，包括直接發送信息給瀏覽器，重定位瀏覽器到另一個URL或設置Cookie值

屬性： Buffer

CacheControl

Charset

ContentType

Expires

ExpiresAbsolute

IsClientConnected

PICS

Status

集合： Cookies

方法： AddHeader

AppendToLog

BinaryWrite

Clear

End

Flush

Redirect

Write

Request 訪問任何基于HTTP請求傳遞的信息，常見的有從HTML表單用Post方法或Get方法傳遞的參數，Cookie或用戶認證等。

屬性： TotalBytes

集合： ClientCertificate

Form

QueryString

ServerVaiables

方法： BinaryRead

Server 提供對服務器方法和屬性的訪問

屬性： ScriptTimeout

集合：無

方法： CreatObject

HTMLEncode

MapPath

URLEncode

Recordset

MoveNext 將前數據記錄移至下一條

MovePrevious 將當前數據記錄移至上一條

MoveFirst 將當前數據記錄移至第一條

MoveLast 將當前數據記錄移至最后一條

AbsolutePosition=N 將當前數據記錄移至第N條

EOF 當前數據記錄是否移過了最后一條（發生于向下移動時）

BOF 當前數據記錄是否移過了第一條（發生于向上移動時）

VBScript 運算符

算術運算符

指數取負乘法除法加法減法取模連接整數除法

∧ － * ／ ﹢ ﹣ Mod & \

比較運算符

相等不相等小于大于小于或等于大于或等于對象相象

= <> < > <= >= IS

邏輯運算符

邏輯非邏輯與邏輯或異或邏輯等于邏輯蘊含

Not And Or Xor Eqv Imp

在線咨詢

上一篇：html單選按鈕默認選中怎么做？input標簽的單選按鈕實例
下一篇：大潤發超市線上優惠購買的方法

您的項目需求

*請認真填寫需求信息，我們會在24小時內與您取得聯系。

整合營銷服務商

HTML+CSS CSS3 特殊的“邊線”outline

utline與border的異同：

outline在文本框中的作用：

TML基礎知識

一、HTML的介紹

1. 網頁效果圖 -- 百度

2. html的定義

3. html的作用

二、html 的基本結構

1. 結構代碼

2. 瀏覽網頁文件

3. 小結

三、初始常用的 html 標簽

1. 常用的 html 標簽

2.標簽列表

3.HTML 屬性

4.小結

四、資源路徑

1. 相對路徑

2. 絕對路徑

五、列表標簽

1. 列表標簽的種類

2. 無序列表

3. 有序列表

六、表格標簽

1. 表格的結構

2. 表格標簽

七、表單標簽

1. 表單的介紹

2. 表單相關標簽的使用

3. 小結

八、表單提交

1. 表單屬性設置

2. 表單元素屬性設置

3. 示例代碼

4.小結

您的項目需求