python 之 前端初識 html
阿新 • • 發佈:2018-12-26
html語法程式碼示例
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Login</title> 6 </head> 7 <body> 8 9 </body> 10 </html>
程式碼第一行為觸發瀏覽器使用說明模式來解析此html文件,這個示例是目前流行的html5寫法,
之所以存在這種寫法,是因為當前瀏覽器所支援的標準並未完全統一,為了讓html文件能在更多瀏覽器上按照正確的方式解析,我們需要在文件開頭宣告一個文件型別標準,
早期的微軟ie產品使用的是自己的一套標準,並非公認標準,後來慢慢遵循公認標準,但是又不與之情的產品完全相容,故提供一種解決方案
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
該程式碼是為了相容微軟早期ie產品,讓ie使用最新的模式解析文件
該文件型別有多種模式
Quirks Mode怪異模式
Standards Mode標準模式
Almost Standards Mode幾乎接近標準的模式
1頁面編碼
1 <meta http-equiv="content-type" content="text/html" charset="UTF-8">
2重新整理和跳轉
1 <meta http-equiv="Refresh" content="3" /> 2 <meta http-equiv="Refresh" content="5;url=https://github.com/zengchunyun"/>
3關鍵字
通過設定關鍵字,爬蟲會優先將關鍵字錄入,當別人通過關鍵字搜尋時,可以通過關鍵字找到設定了關鍵字的網站
1 <meta name="keywords" content="曾春雲,部落格" />
4描述
1 <meta name="description" content="Python 是世界上最好學的語言" />
5書籤標題
1 <title>https://github.com/zengchunyun</title>
6 link
書籤圖示
1 <link rel="shortcut icon" href="icon.ico" />
匯入css
1 <link type="text/css" href="common.css" rel="stylesheet">
在head部還可以直接編寫全域性css樣式模版
1 <style type="text/css"> 2 .cc{ 3 color: #00A000; 4 font-size: 24px; 5 } 6 .cc2{ 7 color: purple; 8 font-size: 48px; 9 } 10 </style>
引用js程式碼
1 <script type="text/javascript" src="http://www.googletagservices.com/tag/js/gpt.js"></script>
直接編寫js程式碼
1 <script type="text/javascript"> 2 bla..bla.. 3 </script>
常用標籤
標籤一般分為兩種:塊級標籤和行內標籤
- a,span, select等
- div, h1, p等
p和br
p表示段落,預設段落之間是有間隔的
br是換行
a標籤
1 <a href="https://github.com/zengchunyun" target="_blank">我的GitHuP</a> 2 <!-- target設定超連結屬性,blank表示在新標籤開啟頁面 -->
錨
H標籤
1 <h1>H1</h1> 2 <h2>H2</h2> 3 <h3>H3</h3> 4 <h4>H4</h4> 5 <h5>H5</h5> 6 <h6>H6</h6>
H1
H2
H3
H4
H5
H6
select標籤