Python-HTML基礎

時間 2019-11-09

標籤 python html 基礎欄目 Python 简体版

原文原文鏈接

一、HTML

一、HTML是什麼

超文本標記語言，即學習這門語言就是在一堆標記css

二、爲什麼要用？

標記文本html

三、如何用？

HTML標籤就是用來作記號的，雖然這些記號自帶一些樣式，但務必忽略掉記號的樣式，樣式會專用用css來作web

HTML標籤格式:
標籤/元素
標籤的語法：
<標籤名屬性名="屬性值">包含的文本內容</標籤名>
<標籤名屬性名="屬性值" />瀏覽器

只站在html角度，按照可否嵌套子標籤，能夠將標籤分爲兩大類：
容器類標籤：能夠嵌套任意其餘類型的標籤好比：<div>和</div>
文本類標籤：只能嵌套文字、圖片、超連接好比：<br/>、<hr/>、<img src="1.jpg" />等。服務器

幾個很重要的屬性：
id：定義標籤的惟一ID，HTML文檔樹中惟一
class：爲html元素定義一個或多個類名（classname）(CSS樣式類名)
style：規定元素的行內樣式（CSS樣式）app

2. HTML文檔結構

最基本的HTML文檔：
<!DOCTYPE html> 聲明爲HTML5文檔
<html lang="zh-CN"> 是文檔的開始標記和結束的標記。
是HTML頁面的根元素，在它們之間是文檔的頭部（head）和主體（body）。
<head> 定義了HTML文檔的開頭部分。它們之間的內容不會在瀏覽器的文檔窗口顯示。包含了文檔的元（meta）數據。
<meta charset="UTF-8"> 對於中文網頁須要使用 <meta charset="utf-8"> 聲明編碼，不然會出現亂碼
有些瀏覽器會設置 GBK 爲默認編碼，則你須要設置爲 <meta charset="gbk">。
<title>css樣式優先級</title> 定義了網頁標題，在瀏覽器標題欄顯示。
</head>
<body> 之間的文本是可見的網頁主體內容。
</body>
</html>post

3. 經常使用標籤

1.head內經常使用標籤

<title></title> 定義網頁標題
<style></style> 定義內部樣式表
<script></script> 定義JS代碼或引入外部JS文件
<link/> 引入外部樣式表文件
<meta/> 定義網頁原信息學習

2 body內經常使用標籤

1 基本標籤（塊級標籤和內聯標籤）

<b>加粗</b>
<i>斜體</i>
<u>下劃線</u>
<s>刪除</s>編碼

<p>段落標籤</p>url

<br>

<hr>

2 特殊字符

空格  
> >
< <
& &
¥ ¥
版權 ©
註冊 ®

3 div標籤和span標籤

div標籤用來定義一個塊級元素，並沒有實際的意義。主要經過CSS樣式爲其賦予不一樣的表現。
span標籤用來定義內聯(行內)元素，並沒有實際的意義。主要經過CSS樣式爲其賦予不一樣的表現。

4 img標籤

5 a標籤

href屬性指定目標網頁地址。該地址能夠有幾種類型：
絕對URL - 指向另外一個站點（好比 href="http://www.jd.com）
相對URL - 指當前站點中確切的路徑（href="index.htm"）
錨URL - 指向頁面中的錨（href="#top"）
<a href="http://www.oldboyedu.com" target="_blank" >點我</a>

6 列表

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 數字列表，默認值
A 大寫字母
a 小寫字母
Ⅰ大寫羅馬
ⅰ小寫羅馬
3.標題列表
<dl>
<dt>標題1</dt>
<dd>內容1</dd>
<dt>標題2</dt>
<dd>內容1</dd>
<dd>內容2</dd>
</dl>

7 表格

8 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）。

9 input

<input> 元素會根據不一樣的 type 屬性，變化爲多種形態。
type屬性值表現形式對應代碼
text 單行輸入文本 <input type=text" />
password 密碼輸入框 <input type="password" />
date 日期輸入框 <input type="date" />
checkbox 複選框 <input type="checkbox" checked="checked" />
radio 單選框 <input type="radio" />
submit 提交按鈕 <input type="submit" value="提交" />
reset 重置按鈕 <input type="reset" value="重置" />
button 普通按鈕 <input type="button" value="普通按鈕" />
hidden 隱藏輸入框 <input type="hidden" />
file 文本選擇框 <input type="file" />
屬性說明:
name：表單提交時的「鍵」，注意和id的區別
value：表單提交時對應項的值
type="button", "reset", "submit"時，爲按鈕上顯示的文本年內容
type="text","password","hidden"時，爲輸入框的初始值
type="checkbox", "radio", "file"，爲輸入相關聯的值
checked：radio和checkbox默認被選中的項
readonly：text和password設置只讀
disabled：全部input均適用

10 select標籤

<form action="" method="post">
<select name="city" id="city">
<option value="1">北京</option>
<option selected="selected" value="2">上海</option>
<option value="3">廣州</option>
<option value="4">深圳</option>
</select>
</form>
屬性說明：
multiple：布爾屬性，設置後爲多選，不然默認單選
disabled：禁用
selected：默認選中該項
value：定義提交時的選項值

REFERENCE-LIWENZHOU :http://www.cnblogs.com/liwenzhou/p/7988087.html