HTML協(xié)議簡介
Web服務本質
瀏覽器發(fā)請求 --> HTTP協(xié)議 --> 服務端接收請求 --> 服務端返回響應 --> 服務端把HTML文件內(nèi)容發(fā)給瀏覽器 --> 瀏覽器渲染頁面
HTML是什么?
超文本標記語言(Hypertext Markup Language, HTML)是一種用于創(chuàng)建網(wǎng)頁的標記語言。
本質上是瀏覽器可識別的規(guī)則碧库,我們按照規(guī)則寫網(wǎng)頁道宅,瀏覽器根據(jù)規(guī)則渲染我們的網(wǎng)頁。對于不同的瀏覽器摩幔,對同一個標簽可能會有不同的解釋。(兼容性問題)
網(wǎng)頁文件的擴展名:.html或.htm
HTML不是什么?
HTML是一種標記語言(markup language)辜限,它不是一種編程語言,也就是說他的邏輯性并沒有那么強
HTTP結構
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>******</title>
</head>
<body>
</body>
</html>
- !DOCTYPE html>聲明為HTML5文檔严蓖。
- <html>薄嫡、</html>是文檔的開始標記和結束的標記。是HTML頁面的根元素颗胡,在它們之間是文檔的頭部(head)和主體(body)毫深。
- <head>、</head>定義了HTML文檔的開頭部分毒姨。它們之間的內(nèi)容不會在瀏覽器的文檔窗口顯示费什。包含了文檔的元(meta)數(shù)據(jù)。
- <title>、</title>定義了網(wǎng)頁標題鸳址,在瀏覽器標題欄顯示瘩蚪。
- <body>、</body>之間的文本是可見的網(wǎng)頁主體內(nèi)容稿黍。
標簽
學習html首先就要學習標簽疹瘦,標簽就類似于html中的關鍵字,不同的標簽負責完成不同的功能巡球。
接下來就按照HTML主體結構的順序來總結不同的標簽
在這之前
<!--注釋內(nèi)容-->
寫什么都不能忘了注釋
<!DOCTYPE> 標簽
<!DOCTYPE> 聲明必須是 HTML 文檔的第一行言沐,位于 <html> 標簽之前。
<!DOCTYPE> 聲明不是 HTML 標簽酣栈;它是指示 web 瀏覽器關于頁面使用哪個 HTML 版本進行編寫的指令险胰。
<head常用標簽>
head可以說是網(wǎng)頁的頭文件,包含網(wǎng)頁的一些信息矿筝,但是卻不會顯示出來
表格已經(jīng)總結的很清楚了起便,而meta屬性算是其中比較復雜的屬性了,包含http-equiv屬性和name兩種屬性窖维。
<body內(nèi)常用標簽>
h1~h6: 字號越來越小 但是都是粗體 一般用作標題
img: src源文件路徑 網(wǎng)絡或者本地都可以 alt 如果圖片找不到了顯示什么 title 鼠標放在圖片上顯示什么 id 圖片的標簽 style 設計風格
a: href 鏈接 target 在target頁面打開鏈接 #id 跳到當前頁的這個id處
b: 將字體加粗
i :字體變?yōu)樾斌w
s : 下劃線
u : 表示刪除的橫線
p: 段落標記 分段
hr : 水平線
br : 換行
特殊符號   空格; © 版權標識c; < 小于; > 大于; ® 注冊符號...
而特殊符號的目的是為了防止輸出內(nèi)容與html標簽混淆
- html 當中無論多少空格都當成一個 除非用 表示空格
兩個重要標簽
div標簽和span標簽:表現(xiàn)形式與正常無異
div單獨一行
div單獨一行
span接成一行span接成一行span接成一行span接成一行
他們的特點就是沒有特點榆综,所以寫網(wǎng)頁時用的比較多,可塑性很強
- 標簽分類:
- 塊級標簽 h1~h6 div p hr
默認占瀏覽器寬度(單獨占一行)
能設置長和寬 - 內(nèi)聯(lián)標簽(行內(nèi)標簽) a img u s i b span
根據(jù)內(nèi)容決定長度
不能設置長和寬
- 塊級標簽 h1~h6 div p hr
- 標簽的嵌套規(guī)則
- 行內(nèi)標簽不能嵌套塊級標簽
- p標簽不能嵌套塊級標簽 p標簽不能嵌套div p 內(nèi)的標簽會被自動修改
- div可以套div 最常用
一些特殊的結構
- 列表:
無序列表 前面有實心圓或者別的符號表示開端
有序列表 前面用數(shù)字表示順序
1.無序列表
<ul type="disc">
<li>第一項</li>
<li>第二項</li>
</ul>
type屬性:
disc(實心圓點铸史,默認值)
circle(空心圓圈)
square(實心方塊)
none(無樣式)
2.有序列表
<ol type="1" start="2">
<li>第一項</li>
<li>第二項</li>
</ol>
type屬性:
1 數(shù)字列表鼻疮,默認值
A 大寫字母
a 小寫字母
Ⅰ大寫羅馬
ⅰ小寫羅馬
3.標題列表 帶縮進的三級標題
<dl>
<dt>標題1</dt>
<dd>內(nèi)容1</dd>
<dt>標題2</dt>
<dd>內(nèi)容1</dd>
<dd>內(nèi)容2</dd>
</dl>
- 表格:
<table>表格開始
<thead>表頭
<tr>表示一行
<th>序號</th>表示一列
<th>姓名</th>
<th>愛好</th>
</tr>
</thead>
<tbody>表格主體
<tr>
<td>***</td>
<td>***</td>
<td>***</td>
</tr>
<tr>
<td>***</td>
<td>***</td>
<td>***</td>
</tr>
</tbody>
</table>
- 不寫thead也可以,但是良好的習慣是要求寫的
屬性:
border: 表格邊框.
cellpadding: 內(nèi)邊距
cellspacing: 外邊距.
width: 像素 百分比.(最好通過css來設置長寬)
rowspan: 單元格豎跨多少行
colspan: 單元格橫跨多少列(即合并單元格)
又開新坑了,數(shù)據(jù)庫學完了琳轿,高級用法卻遲遲沒有整理判沟,拖延癥害人啊