9.04學習筆記

時間 2019-11-19

標籤 9.04 學習筆記简体版

原文原文鏈接

在手機上測試頁面效果步驟

1. 頁面要以服務器形式啓動,也就是說以http://域名: 端口號

用HBuilder,WebStorm便可

2. 開始->搜索：CMD ,輸入：ipconfig就會顯示當前設備的網絡信息

找到IPV4地址就是你的IP了

Win8/Win10: win+r:CMD

3. 將頁面上的域名：127.0.0.1 / localhost 替換成你的IP(第二部獲取)

4. 讓手機和電腦保持在一個網絡環境下(局域網)

5. 複製電腦上URL到：草料二維碼生成一個二維碼

6. 用手機到掃一掃便可

A標籤

<em>傾斜效果，同時有語義強調</em>

strong

<strong>加粗效果，同時有語義強調</strong>

列表

無序列表(愛好,技能)

</ul>

有序列表

<li>冰箱門打開</li>

<li>大象塞進去</li>

<li>冰箱門關上</li>

</ol>

自定義列表

<dl>

<dd>冰箱門打開</dd>

<dd>冰箱門關上</dd>

</dl>

span:替換font修飾文字,可是自身不帶有樣式語法,仍是須要使用CSS

我愛<span style="color:red;">北京</span>天安門

表格

<table border="1" width="50%" align="center"

cellpadding="20" cellspacing="15">

</tr>

</table>

border:邊框寬度

cellpadding:單元格填充（內邊距）-內容到邊框的距離

cellspacing:單元格間距（外邊距）-格子與格子之間的距離

align:對齊方式

width:寬度

colspan:跨列(column)

rowspan:跨行(row)

表單:用戶和服務器交互的橋樑

<form name="myform" action="數據要發送的目標地址"

method="get/post">

..........

</form>

method:默認GET

GET與POST的區別:

GET：在URL地址中傳輸數據,http://www.xx.com/w?id=123&sex=boy

不安全，瀏覽器中對URL長度有限制

去服務器獲取商品列表等一些信息

POST：以文件形式發送，在URL地址中看不到數據，長度無限制

去服務器刪除，新增，修改

表單元素

帳號：<input type="text"><br>

密碼：<input type="password"><br>

確認密碼：<input type="password"><br>

年齡：<input type="number" min="18" max="120"><br>

性別：

<label>

<input type="radio" checked name="sex">男

</label>

<label>

<input type="radio" name="sex">女

</label>

<br>

手機號：<input type="number" min="11111111111" max="1999999999"><br>

郵箱：<input type="email"><br>

學歷：

</select><br>

技能：

<label><input type="checkbox">JavaScript</label>

<br>

</fieldset>

塊元素與行內元素(內聯元素)

塊元素：獨佔一行，能夠設置寬高,寬度默認100%。

DIV,P,h1-h6,LI,UL,OL

內聯（行內）元素：內容有多少就佔多大地方，不能設置寬高

a,b,i,s,u,span,input

disabled與readonly的區別？

1. 外觀有一點區別

2. 只讀能夠複製

3. 提交表單的時候不會提交disabled修飾的元素

===

<body>

不經常使用

文件域：<input type="file"><br>

隱藏域：<input type="hidden" value="789"><br>

圖像域：<input type="image" src="../img/flower8.jpg" /><br>

html5新增：

年月日 <input type="date"><br>

時間 <input type="time"><br>

年月日+時間 <input type="datetime-local"><br>

顏色： <input type="color">

搜索：<input type="search">

range: <input type="range">

禁用：<input type="text" disabled value="123"><br>

只讀：<input type="text" value="456" readonly><br>

下拉菜單：<select name="" id="">

</optgroup>

</optgroup>

</optgroup>

</select><br>

</body>

select選項中默認的option

兩個默認的用法

checked:checkbox（多選）,radio（單選）

selected:select（下拉菜單）

如圖:

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。