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

看電腦性別

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

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

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

HTML常用mete解釋

mete標(biāo)簽就是對(duì)不可解釋的解釋.

ahtuor:我是MM

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

keywords:求認(rèn)識(shí)

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

desciption:聊聊吧

<meta name="keywords" content="這是一個(gè)有節(jié)操的網(wǎng)站,求度娘,谷歌認(rèn)了我這個(gè)可愛的MM,其他搜索引擎DIAO都不DIAO" />

robots:先摸下我底線吧

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

refresh:換個(gè)姿勢(shì)吧

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

viewport:讓你的朋友認(rèn)識(shí)我吧!

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

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

apple-itunes-app

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

telephone和email

<meta content="telephone=no" name="format-detection" /> 
是否識(shí)別手機(jī)號(hào)和郵箱

cache-control:不要隨便改變我

<meta http-equiv="Cache-Control" content="no-siteapp" />
避免百度轉(zhuǎn)碼.必須會(huì)對(duì)對(duì)移動(dòng)端不友好的網(wǎng)頁進(jìn)行轉(zhuǎn)碼.

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

<html>
	<head> 
		標(biāo)題 ---此處放置標(biāo)題、導(dǎo)航、登錄等內(nèi)容
		<!此處放置標(biāo)題、導(dǎo)航、登錄等內(nèi)容--->
	</head>
	<body> 
		<!此處放置頁面主要內(nèi)容--->
		<! ：空格
		<: 小于號(hào)
		>: 大于號(hào)
		": 引號(hào)--->
		<p>第一段 世界大勢(shì)，合久必分，分久必合。</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>本文字已被刪除，請(qǐng)忽略</del>
		
		<p> hello     world</p>  <!段落標(biāo)記--->
		<a href="http://www.baidu.com" target="_self"> 點(diǎn)擊進(jìn)入百度</a>
		<br/>
		<img src="http://mysite.com/mypic.png" alt="網(wǎng)站作者照片">
		<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>三種列表的表達(dá)方式:</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>內(nèi)存</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是用來開發(fā)網(wǎng)頁的，它是開發(fā)網(wǎng)頁的語言

HTML的定義

全稱HyperText Mark-up Language，超文本標(biāo)記語言

標(biāo)記就是標(biāo)簽

<標(biāo)簽名稱></標(biāo)簽名稱> 比如 <html></html> <h1></h1>等，標(biāo)簽大多數(shù)都是成對(duì)出現(xiàn)的。

超文本兩層含義：

因?yàn)榫W(wǎng)頁中還可以有圖片、視頻、音頻等內(nèi)容（超越文本限制）
它還可以在網(wǎng)頁中跳轉(zhuǎn)到另一個(gè)網(wǎng)頁，與世界各地主機(jī)的網(wǎng)頁鏈接（超鏈接文本）

HTML的基本結(jié)構(gòu)

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>網(wǎng)頁標(biāo)題</title>
    </head>
    <body>
        網(wǎng)頁顯示內(nèi)容
    </body>
</html>

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

網(wǎng)頁文件的后綴是.html, 一個(gè)html文件就是一個(gè)網(wǎng)頁，html文件用編輯器打開顯示的是文本，可以用文本的方式編輯它，如果用瀏覽器打開，瀏覽器會(huì)按照標(biāo)簽描述內(nèi)容將文件渲染成網(wǎng)頁

VS Code 安裝

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

下載網(wǎng)址: https://code.visualstudio.com/Download

選擇對(duì)應(yīng)的安裝包進(jìn)行下載:

安裝一切默認(rèn)

VS Code 的插件安裝

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

常用的HTML標(biāo)簽

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

標(biāo)簽的使用形式

成對(duì)出現(xiàn)的標(biāo)簽
標(biāo)簽的嵌套
單個(gè)出現(xiàn)的標(biāo)簽
帶屬性的標(biāo)簽

列表標(biāo)簽

無序列表標(biāo)簽(ul標(biāo)簽)
有序列表標(biāo)簽(ol標(biāo)簽)

網(wǎng)頁效果

表格標(biāo)簽

<table>標(biāo)簽：表示一個(gè)表格
<tr>標(biāo)簽：表示表格中的一行
<td>標(biāo)簽：表示表格中的列
<th>標(biāo)簽：表示表格中的表頭

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

網(wǎng)頁效果

表單標(biāo)簽

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

<form>標(biāo)簽表示表單標(biāo)簽，定義整體的表單區(qū)域

一個(gè)表單中有很多信息組成,比如姓名,愛好,地址等,這些內(nèi)容有很多其他標(biāo)簽來承載

這些標(biāo)簽稱為表單元素標(biāo)簽

網(wǎng)頁效果

表單提交

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

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

兩種方式的區(qū)別:

“GET”方式 : 沒有請(qǐng)求體
“POST”方式 : 有請(qǐng)求體

表單元素屬性設(shè)置

name: 表單元素的名稱，用于作為提交表單數(shù)據(jù)時(shí)的參數(shù)名
value: 表單元素的值，用于作為提交表單數(shù)據(jù)時(shí)參數(shù)名所對(duì)應(yīng)的值

<!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>個(gè)人描述:</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>

點(diǎn)擊提交：

可以看到服務(wù)器收到了請(qǐng)求報(bào)文。

在線咨詢

上一篇：了解什么是HTML5
下一篇：html運(yùn)行代碼

您的項(xiàng)目需求

*請(qǐng)認(rèn)真填寫需求信息，我們會(huì)在24小時(shí)內(nèi)與您取得聯(lián)系。

整合營銷服務(wù)商

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

看電腦性別

HTML常用mete解釋

TML的作用

HTML的定義

HTML的基本結(jié)構(gòu)

VS Code 安裝

VS Code 的插件安裝

常用的HTML標(biāo)簽

表單提交

您的項(xiàng)目需求