超文本標記語言(Hypertext Markup Language, HTML)

是一種用于創建網頁的標記語言,不是一種編程語言,沒有邏輯的

HTML基礎文檔結構

#聲明為HTML5文檔

#是文檔的開始標記和結束的標記,lang設置瀏覽器語言

#定義了網頁標題,在瀏覽器標題欄顯示,charset聲明編碼,否則會出現亂碼

網頁標題　　#定義了網頁標題,在瀏覽器標題欄顯示

標簽的語法

內容部分標簽名>

定義網頁標題定義內部樣式表定義JS代碼或引入外部JS文件引入外部樣式表文件 定義網頁原信息

標簽分類

塊級標簽(行級標簽):

h1-h6, p, div, table, ol, ul, form,

內聯標簽(行內標簽):

a, img, span, strong, select, input

基本標簽(塊級標簽和內聯標簽)

不加標簽的純文字也是可以在body中寫的加粗

斜體

下劃線

刪除

標題1

標題2

標題3

標題4

標題5

標題6

---

#就是單獨個一個水平線

Meta標簽兩個屬性分別是http-equiv屬性和name屬性

http-equiv屬性:

#如果把URL和后面的內容去掉，就是2秒鐘刷新一次，這些內容了解一下就行

#edge是微軟的一個全新的瀏覽器,其實就是告訴IE瀏覽器

name屬性: #關鍵字，也就是別人是可以通過這些關鍵字搜索到我的這個文章的，搜索引擎就是能夠這個content內容來幫別人搜索到你的這個文檔的#SEO就是做這個的

#是對這個文檔的描述

a標簽(超鏈接標簽)

超鏈接是指從一個網頁指向一個目標的連接關系,這個目標可以是另一個網頁,也可以是相同網頁上的不同位置,還可以是一個圖片,一個電子郵件地址,一個文件,甚至是一個應用程序

href屬性指定目標網頁地址,該地址可以有幾種類型

絕對URL- 指向另一個站點(href="http://www.jd.com)

相對URL - 指當前站點中確切的路徑(href="index.htm")

錨URL- 指向頁面中的錨(href="#top")

target:

_blank表示在新標簽頁中打開目標網頁

_self表示在當前標簽頁中打開目標網頁頂點......回到頂部

#跳轉一個新標簽頁

管理系統

#title 鼠標放上去之后顯示出來的提示語(連接到圖片)

連接到指定文件

img標簽

src的路徑又分為兩種:網上的一個圖片路徑和本地的一個相對圖片路徑#本地圖片

#網絡圖片

p段落標簽：包裹的文字自成一個段落，此段落自帶行間距

黃山落葉松葉落山黃

上海自來水來自海上

山西運煤車煤運西山

div標簽：除了換行什么都沒有

西湖垂柳絲柳錘西湖黃山落葉松葉落山黃

span標簽：無任何效果,一行輸出

西湖垂柳絲柳錘西湖

黃山落葉松葉落山黃

table標簽：自帶換行

tr: 定義table標簽里的一行

td: 定義tr標簽里的一個單元格

border="1"給表格加邊框

rowspan: 單元格豎跨多少行

colspan: 單元格橫跨多少列(即合并單元格)

caption: 表格的標題

表格標題

a	b	c	j
d		e		f	h	m

列表標簽

ul無序列表

type屬性:

disc (實心圓點,默認值)

circle(空心圓圈)

square(實心方塊)

none(無樣式)

ol有序列表

type屬性: start是從數字幾開始1數字列表,默認值

A 大寫字母

a 小寫字母

Ⅰ大寫羅馬

ⅰ小寫羅馬

dl標題列表(就像大綱一樣,有一個層級效果)

通過dt定義一級元素

通過dd定義二級元素

• a
• b

c

d

標題1

內容1

標題2

內容2

form表單

功能：

表單用于向服務器傳輸數據,從而實現用戶與Web服務器的交互

表單能夠包含input系列標簽,比如文本字段、復選框、單選框、提交按鈕等等

表單還可以包含textarea、select、fieldset和 label標簽

表單屬性

屬性描述

accept-charset

規定在被提交表單中使用的字符集(默認：頁面字符集)。

action

規定向何處提交表單的地址(URL)(提交頁面)。

autocomplete

規定瀏覽器應該自動完成表單(默認：開啟)。

enctype

規定被提交數據的編碼(默認：url-encoded)。

method

規定在提交表單時所用的 HTTP 方法(默認：GET)。

name

規定識別表單的名稱(對于 DOM 使用：document.forms.name)。

novalidate

規定瀏覽器不驗證表單。

target

規定 action 屬性中地址的目標(默認：_self)

input

元素會根據不同的type屬性,變化為多種形態

type屬性值表現形式對應代碼

text

單行輸入文本

password

密碼輸入框(不顯示明文)

date

日期輸入框

checkbox

復選框

radio

單選框

submit

提交按鈕

#發送瀏覽器上輸入標簽中的內容，配合form表單使用，頁面會刷新

reset

重置按鈕

?#頁面不會刷新，將所有輸入的內容清空

button

普通按鈕

hidden

隱藏輸入框

file

文本選擇框

(等學了form表單之后再學這個)

屬性說明:

name：表單提交時的'鍵',注意和id的區別

value：表單提交時對應項的值

type="button", "reset", "submit"時,為按鈕上顯示的文本年內容

type="text","password","hidden"時,為輸入框的初始值

type="checkbox", "radio", "file",為輸入相關聯的值

checked：radio和checkbox默認被選中的項

readonly：text和password設置只讀

disabled：所有input均適用

select標簽

屬性說明：

multiple：布爾屬性，設置后為多選下拉框，否則默認單選

disabled：禁用

selected：默認選中該項

value：定義提交時的選項值

label標簽

定義：標簽為 input 元素定義標注(標記),如果不用這個label給input標簽一個標記,input會變黃,不影響使用,只是提示你,別忘了給用戶一些提示,也就是這個label標簽

說明：

label 元素不會向用戶呈現任何特殊效果.但是點擊label標簽里面的文本,那么和他關聯的input標簽就獲得了光標,讓你輸入內容 標簽的 for屬性值應當與相關元素的 id 屬性值相同。

extarea多行文本

屬性說明：

name：名稱

rows：行數#相當于文本框高度設置

cols：列數 #相當于文本框長度設置

disabled：禁用

用戶名

密碼

選項1

選項2

選項3

選項4

選項1選項2

選項1選項2選項3

總結

以上是生活随笔為你收集整理的python前端代码_python前端HTML的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。