分辨自己電腦性別和最全HTML常用mete整理

看電腦性別

難道真的不想看看你整天對著的電腦.做著不可描述的事,也不想了解了下它的性別?難道人類就是這么狠心嗎?/(ㄒoㄒ)/~~

接下打開你萬能的記事本.寫入這段代碼: CreateObject("SAPI.SpVoice").Speak"你猜猜我是男是女"

隨便改個文件名,后綴為vbs即可(栗子:xx.vbs) .點擊它就OK了

HTML常用mete解釋

mete標簽就是對不可解釋的解釋.

ahtuor:我是MM

<meta name="author" content="我是一個漂亮的MM" />

keywords:求認識

<meta name="keywords" content="節操,MM,漂亮的MM" />

desciption:聊聊吧

<meta name="keywords" content="這是一個有節操的網站,求度娘,谷歌認了我這個可愛的MM,其他搜索引擎DIAO都不DIAO" />

robots:先摸下我底線吧

<meta name="keywords" content="all" />
all : 文件將被檢索
none : 文件不被檢索,頁面鏈接可以被查詢
index : 文件將被檢索
follow : 頁面鏈接允許查詢
noindex : 文件不被檢索,鏈接允許查詢
nofloow : 文件允許檢索,鏈接不允許查詢

refresh:換個姿勢吧

meta http-equiv="refresh" content="1;url=www.annsn.com" />
聽我解釋:不聽.我不聽
content內的數字代表秒數.url代表跳轉的地址.這個mete功能標簽叫做重定向
搜索引擎能夠自動檢測重定向,由于不能指定重定向原因.如302.404
不給搜索引擎解釋的話,它就不能友好跟我們的做朋友了

viewport:讓你的朋友認識我吧!

<meta name="viewport" content="width=device-width; initial-scale=1.0;maximum-scale=1.0; user-scalable=no;"/>
適用于移動設備
initial-scale : 初始縮放比例.范圍0-10
minimun-scale :允許縮放最小比例
maximum-scale :允許縮放最大比例
user-scalable : 使用可以手動縮放no或者yes

apple-mobile-web-app-title:看名字就很DIAO了,只適合APPLE

apple-itunes-app

<meta name="apple-mobile-web-app-title" content="拿出你的IPhone就知道有什么用了">
主屏標題
<mete name='apple-itunes-app" content='myappstoreid,affiliate-date=myaffiliatedate,app-argument=myurl">
如果你在appstore上架程序,可以在別人網站時顯示引導安裝你程序

telephone和email

<meta content="telephone=no" name="format-detection" /> 
是否識別手機號和郵箱

cache-control:不要隨便改變我

<meta http-equiv="Cache-Control" content="no-siteapp" />
避免百度轉碼.必須會對對移動端不友好的網頁進行轉碼.

╮(╯▽╰)╭不寫了,感覺這些太無聊了.還有設置編碼.瀏覽器內核控制.QQ,微信等.參考QQ瀏覽器內核標簽說明

<html>
	<head> 
		標題 ---此處放置標題、導航、登錄等內容
		<!此處放置標題、導航、登錄等內容--->
	</head>
	<body> 
		<!此處放置頁面主要內容--->
		<! ：空格
		<: 小于號
		>: 大于號
		": 引號--->
		<p>第一段 世界大勢，合久必分，分久必合。</p>
		<hr/> <!表示單行橫線顯示--->
		<br/> <!表示換行--->
		<h1> hello world, html is easy</h1>
		<h2> hello world, html is easy</h2>
		<h3> hello world, html is easy</h3>
		<h4> hello world, html is easy</h4>
		<h5> hello world, html is easy</h5>
		<h6> hello world, html is easy</h6>
		<p>普通字體</p>
		<b>粗體</b> <i>斜體</i> <del>本文字已被刪除，請忽略</del>
		
		<p> hello     world</p>  <!段落標記--->
		<a href="http://www.baidu.com" target="_self"> 點擊進入百度</a>
		<br/>
		<img src="http://mysite.com/mypic.png" alt="網站作者照片">
		<h3> 普通無邊框表格：</h3>
		<table>
		<tr>
			<td>row 1 cell 1</td> <td>row 1 cell 2</td> <td>row 1 cell 3</td>
		</tr>
		<tr>
			<td>row 2 cell 1</td> <td>row 2 cell 2</td> <td>row 2 cell 3</td>
		</tr>
		</table>
		
		<h3>帶表頭，有邊框，有跨列單元:</h3>
		<table border="1">
		<tr>
			<th>head1</th> <th>head2</th> <th>head3</th>
		</tr>
		<tr>
			<td>row 1 cell 1</td> <td>row 1 cell 2</td> <td>row 1 cell 3</td>
		</tr>
		<tr>
			<td>row 2 cell 1</td> <td>row 2 cell 2</td> <td>row 2 cell 3</td>
		</tr>
		</table>
		
		<h3>三種列表的表達方式:</h3>
		<table cellpadding="2" cellspacing="2">
		<tr>
			<td>
				<ul><li>python</li> <li>c++</li> <li>java</li> <li>golang</li></ul>
			</td>
			<td>
				<ol><li>python</li> <li>c++</li> <li>java</li> <li>golang</li></ol>
			</td>
		</tr>
		</table>
		<dl>
			<dt>CPU</dt><dd>處理器</dd>
			<dt>MEM</dt><dd>內存</dd>
		</dl>
		
		<body bgcolor="#FF0000">
		<body bgcolor="RGB(255,0,0)">
		<body bgcolor="RED">
		
		<p>視頻</p>
		<object
			classid="clsid:d27sfsfstqwetsasasdfsdfs"
			codebase="http://fpdownload.macromedia.com/pub/shckwave/cabs/flash/swflash.cab">
			<embed src="flashfile.swf" width="300" height="200"></embed>
		</object>
		<br/>
		
		<p>音頻</p>
		<audio controls="crontrols">
			<source src="sample_song.mp3" type="audio/mp3" />
		</audio>
		
		<br/>
		<p>視頻</p>
		<video controls="controls"/>
			<source src="sample_video.mp4" type="video/mp4">
		</video>
		
	    <p>html表單---文本輸入</p>
		<table>
			<tr>
				<td>用戶名：</td>
				<td><input type="text" name="name"></td>
				<td>密碼：</td>
				<td><input type="password" name="pass"></td>
			</tr>
			<tr>
			<tdcolspan="4"> <textarea name="comment" rows="5" cols="60"> </textarea></td>
			</tr>
		</table>
		
		<table>
			<tr>
				<td>性別：</td>
				<td>用戶名：</td>
				<td>男性<input type="radio" checked='checked' name="sex" value="male" /></td>
				<td>女性<input type="radio" checked='checked' value="female" /></td>
			</tr>
			<tr>
			<tdcolspan="4"> <textarea name="comment" rows="5" cols="60"> </textarea></td>
			</tr>
		</table>
		
	</body>

</html>

TML的作用

HTML是用來開發網頁的，它是開發網頁的語言

HTML的定義

全稱HyperText Mark-up Language，超文本標記語言

標記就是標簽

<標簽名稱></標簽名稱> 比如 <html></html> <h1></h1>等，標簽大多數都是成對出現的。

超文本兩層含義：

因為網頁中還可以有圖片、視頻、音頻等內容（超越文本限制）
它還可以在網頁中跳轉到另一個網頁，與世界各地主機的網頁鏈接（超鏈接文本）

HTML的基本結構

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>網頁標題</title>
    </head>
    <body>
        網頁顯示內容
    </body>
</html>

第一行<!DOCTYPE html>是文檔聲明
用來指定頁面所使用的html的版本, 這里聲明的是一個html5的文檔
<html>...</html>標簽是開發人員在告訴瀏覽器
整個網頁是從<html>這里開始的，到</html>結束
也就是html文檔的開始和結束標簽
<head>...</head>標簽用于定義文檔的頭部
是負責對網頁進行設置標題、編碼格式以及引入css和js文件的
<body>...</body>標簽是編寫網頁上顯示的內容

網頁文件的后綴是.html, 一個html文件就是一個網頁，html文件用編輯器打開顯示的是文本，可以用文本的方式編輯它，如果用瀏覽器打開，瀏覽器會按照標簽描述內容將文件渲染成網頁

VS Code 安裝

VS Code全拼是 Visual Studio Code 是由微軟研發的一款免費、開源的跨平臺代碼編輯器
目前是前端(網頁)開發使用最多的一款軟件開發工具

下載網址: https://code.visualstudio.com/Download

選擇對應的安裝包進行下載:

安裝一切默認

VS Code 的插件安裝

Chinese(Simplified) Language Pack for VS Code 中文漢化包
open in browser 右擊在瀏覽器打開html

常用的HTML標簽

1 標簽不區分大小寫，但是推薦使用小寫
2 根據標簽的書寫形式，標簽分為雙標簽(閉合標簽)和單標簽(空標簽) 2.1 雙標簽是指由開始標簽和結束標簽組成的一對標簽，這種標簽允許嵌套和承載內容，比如: div標簽 2.2 單標簽是一個標簽組成，沒有標簽內容，比如: img標簽

標簽的使用形式

成對出現的標簽
標簽的嵌套
單個出現的標簽
帶屬性的標簽

列表標簽

無序列表標簽(ul標簽)
有序列表標簽(ol標簽)

網頁效果

表格標簽

<table>標簽：表示一個表格
<tr>標簽：表示表格中的一行
<td>標簽：表示表格中的列
<th>標簽：表示表格中的表頭

屬性設置
border: 1px solid black:設置邊框和顏色
border-collapse: collapse:設置邊框合并

網頁效果

表單標簽

表單用于搜集不同類型的用戶輸入的數據，然后可以把用戶數據提交到web服務器

<form>標簽表示表單標簽，定義整體的表單區域

一個表單中有很多信息組成,比如姓名,愛好,地址等,這些內容有很多其他標簽來承載

這些標簽稱為表單元素標簽

網頁效果

表單提交

表單用于搜集不同類型的用戶輸入的數據，然后可以把用戶數據提交到web服務器

action屬性設置表單數據提交地址
method屬性設置表單提交的方式，一般有“GET”方式和“POST”方式, 不區分大小寫

兩種方式的區別:

“GET”方式 : 沒有請求體
“POST”方式 : 有請求體

表單元素屬性設置

name: 表單元素的名稱，用于作為提交表單數據時的參數名
value: 表單元素的值，用于作為提交表單數據時參數名所對應的值

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>

<form action="http://192.168.1.106:8080" method="POST">
<label>姓名:</label>
<input type="text" name="username" >
<br>
<label>密碼:</label>
<input type="password" name="password">
<br>
<label>性別:</label>
<input type="radio" name="sex" value="1">男
<input type="radio" name="sex" value="0">女
<br>
<label>愛好:</label>
<input type="checkbox" name="like" value="睡覺">睡覺
<input type="checkbox" name="like" value="吃飯">吃飯
<input type="checkbox" name="like" value="打豆豆">打豆豆
<br>
<label>照片:</label>
<input type="file" name="pic">
<br>
<label>個人描述:</label>
<textarea name="desc"></textarea>
<br>
<label>地址:</label>
<select name="addr">
<option value="1">北京</option>
<option value="2">上海</option>
<option value="3">廣州</option>
<option value="4">深圳</option>
</select>
<br>
<input type="submit" value="提交">
<input type="reset" value="重置">
<input type="button" value="按鈕">
</form>
</body>
</html>

點擊提交：

可以看到服務器收到了請求報文。

在線咨詢

上一篇：了解什么是HTML5
下一篇：html運行代碼

您的項目需求

*請認真填寫需求信息，我們會在24小時內與您取得聯系。

整合營銷服務商

分辨自己電腦性別和最全HTML常用mete整理

看電腦性別

HTML常用mete解釋

TML的作用

HTML的定義

HTML的基本結構

VS Code 安裝

VS Code 的插件安裝

常用的HTML標簽

表單提交

您的項目需求