HTML基礎學習

2021-08-27 08:56:03 字數 4215 閱讀 9781

html的基礎屬性介紹。

什麼是網頁?

乙個html檔案,就是乙個網頁

什麼是**?

什麼是html?

html指的是超文字標記語言(hyper text markup language)

什麼是xhtml?

xhtml指可擴充套件超文字標記語言(標識語言)(extensible hyper text markup language)是一種置標語言,表現方式和超文字標記語言類似,但語法上更加嚴格。

hbuilder開發工具:

ctrl+n: 新建檔案    

ctrl+s: 儲存

ctrl+r: 執行

ctrl+z: 撤銷   

ctrl+c :複製

ctrl+v :貼上  

ctrl+x :剪下   

ctrl+a :全選

ctrl+shift+f:整理**

ctrl+/:注釋

ps:以上快捷鍵可能與輸入法快捷鍵有衝突(工具->選項->常規->快捷鍵中可以自定義快捷鍵)

建立站點:

檔名規範:名稱全部用: 小寫英文本母、數字、下劃線的組合, 其中不得包含漢字、空格和特殊字元; 必須以英文本母開頭

html文件的基本結構:

命名文件型別

說明我們寫的是標記語言

檔案主體(所有要寫的內容)

網頁的除錯工具:

(1)pc端除錯工具的使用 -瀏覽器   測試瀏覽器(chrome,ie,firefox)

(2)移動端除錯工具chrome可以測試移動端頁面(有很多模擬器)

html標記的語法:

《單詞   年齡="30" 愛好="拍戲" 特徵=「」>《單詞 年齡="30" 愛好="吃飯">1、常規標記: 《標記名稱 屬性1名="屬性1值" 屬性2名="屬性2值" ………… >2、空標記:《標記名 屬性1名="屬性1值" />

標記有兩種形式,我們分別稱單標記和雙標記,或者叫空標記和普通標記;

說明:1)寫在尖角號<>裡的第乙個單詞,叫做標記,也叫做標籤,也稱作元素;

2)標記和屬性用空格隔開,屬性和屬性值用等號連線,屬性值必須放在雙引號內

3)乙個標記可以有多個屬性,屬性和屬性之間用空格隔開,屬性不分先後順序;

4)空標記是指沒有結束標籤的標記,必須使用"/" 關閉 例如:

標題字型:

語法:

說明:文字標題共有6個(h1-h6)

(唯一性,放**logo)

四級標題

五級標題

六級標題

字型標記:

語法:

說明:段落標記,標識乙個段落,預設情況下墮落與段落之間有段間距

語法: |

說明:設定字型文字的傾斜效果,據說後邊的傾斜程度大一點

語法:|

說明:設定字型的加粗效果,據說後邊的加粗語氣強烈一些。

語法:

說明:設定文字加下劃線

空標記:

語法:說明:空標記,用來設定字型換行

字元實體:

在html中直接寫空格可能不會顯示,中文的空格顯示,但是不會這樣寫,會通過轉移字元來寫。

不換行空格

>            >右尖括號

列表(ul,ol,dl)

html中有三種列表,分別是:無序列表,有序列表,自定義列表

無序列表:

這個顯示的是前邊帶點的列表,可以通過屬性去掉

有序列表:……

擴充套件內容

知識擴充套件----有序列表的屬性

type:

規定列表中的列表專案的專案符號的型別

語法:1

數字順序的有序列表(預設值)(1, 2, 3, 4)。 a

字母順序的有序列表,小寫(a, b, c, d)。 a

字母順序的有序列表,大寫(a,b,c,d) i

羅馬數字,小寫(i, ii, iii, iv)。 i

羅馬數字,大寫(i, ii, iii, iv)。 2

、start 屬性規定有序列表的開始點。

語法:自定義列表: 名詞

解釋 (definition   description 定義描述) ……

語法: 鏈結文字或

空鏈結說明:

href

部分中url後邊跟的是鏈結頁面的路徑(包含檔名) title屬性,加入這個屬性後,當滑鼠移動到熱點時,則在滑鼠下方顯示title的內容;

target 

屬性引數定義了開啟鏈結的目標視窗。 _blank -- 在新視窗中開啟鏈結 頁面(會保留原視窗) _self -- 在當前視窗開啟鏈結頁面,此為預設值   

插入:語法:

說明:

border

屬性標識了的邊框 width和 height設定其影象在頁面上顯示的寬度和高度。

title

的作用: 滑鼠懸停在該上時顯示的資訊,滑鼠離開就沒有了,html的絕大多數標籤都支援title屬性,title屬性就是專門做提示資訊的,標題;

alt:

當不顯示的時候,提示的資訊。使用者體驗較好

相對路徑和絕對路徑:

相對路徑的寫法:

(同級) 1)當當前檔案與目標檔案在同一目錄下,直接書寫目標檔案的檔名+副檔名;

(上級找下級) 2)當當前檔案與目標檔案所處的資料夾在同一目錄下,寫法如下: 資料夾名/目標檔案全稱+副檔名;

(下級找上級) 3)當當前檔案所處的資料夾和目標檔案在同一目錄下,寫法如下: ../目標檔案檔名+副檔名;

路徑的寫法:

1、相對路徑鏈結(上級找下級) 北京培訓中心

2、相對路徑鏈結(下級找上級) 新聞中心

3、 相對路徑鏈結(同級鏈結) 新聞中心

4常用元素:

語法:說明:沒有具體含義,統稱為塊標籤, 用來設定文件區域,是文件布局常用物件

語法:說明:文字結點標籤 可以是某一小段文字,或是某乙個字。

html中的注釋:

**屬性:

語法:

注釋:注:一對tr表示一行;一對td表示乙個單元格(一列)

***的相關屬性

1)width="**的寬度"

2)height="**的高度"

3)border="**的邊框"

4)bordercolor="邊框色"

5)cellspacing="單元格與單元格之間的間距"

6)cellpadding=「單元格與內容之間的距離"

7)align="**水平對齊方式"    取值:left、right、center、 valign=「垂直對齊」 top\bottom\middle 

8)合併單元格屬性:(td)   合併列: colspan=「所要合併的單元格的列數"   合併行: rowspan=「所要合併單元格的行數」

表單:表單的作用:用來收集使用者的資訊的;

1、表單框

2、表單控制項

語法:說明:

input:標記可以建立按鈕、文字輸入框、選擇框等各種型別的輸入字段。

name:屬性標識表單域的名稱;

type:屬性標識表單控制項的型別,大概有十幾種;

value:屬性定義表單域的預設值,其他屬性根據type的不同而有所變化。

maxlength:控制最多輸入的字元數,

size:控制框的寬度(以字元為單位)

1)文字框

2)密碼框

3)提交按鈕

4)重置按鈕

5)空按鈕

6)單選按鈕組 男 (預設選中)女

7)核取方塊組

*disabled="disabled" (禁用) *  checked="checked"   (預設選中)

表單域下拉列表(選單)

語法:下拉選項1

下拉選項2

…………

表單域多行文字定義:

語法:

說明:多行文字。rows屬性和cols屬性用來設定文字輸入視窗的高度和寬度,單位是字元。

擴充套件知識點:

get與post的區別:

1. get是從伺服器上獲取資料,post是向伺服器傳送資料。

2. get是把引數資料佇列加到提交表單的action屬性所指的url中,在url中可以看到。post是通過http post機制,使用者看不到這個過程 。

3. get傳送的資料量較小,不能大於2kb。post傳送的資料量較大,一般被預設為不受限制。

4. get安全性非常低,post安全性較高。但是執行效率卻比post方法好。

HTML學習基礎

作用 定義文件型別,擺脫瀏覽器的怪異模式,如果web開發人員加入的doctype,說明他知道他所要做的事情,只要doctype標籤存在就足以開啟嚴格模式 標準模式 了,頁面也會按照標準來渲染。常見使用方法 關係 和 上面的一長串是子串 短的 和母串 長的 的關係 使用好處 1 你可以輕鬆的寫下這個d...

HTML基礎學習

表示使用的html版本 字符集標題標籤 標題 段落標籤 水平標籤 換行標籤 和沒有語意連個盒子 強調語義標籤 加粗 傾斜 刪除 下劃線 影象標籤 超連結標籤 描點 內容 內容base標籤 列表 無序 有序 三星 華為 蘋果 自定義列表 手機 三星 華為 蘋果 基本屬性 cellpadding 內容與...

HTML基礎學習

總結不區分大小寫 不宣告編碼會導致中文亂碼 大部分瀏覽器 charset utf 8 部分瀏覽器 如360 charset gbk 沒有內容的html元素被稱為空元素。沒有關閉標籤的空元素 關閉空元素的正確方法 在開始標籤中新增斜桿 class 為html元素定義乙個或多個類名 classname ...