A今天我學到了什么:
1.margin的一些小問題
//給子元素margin-top,父元素移動,子元素不移動
解決方案:
1.overflow:hidden;
2.給父元素設置偽元素:one:before{content";
display:table}
例子:
.one {
width: 300px;
height: 300px;
background-color: red;
/*overflow: hidden;*/
}
.one:before{
content: "";
display: table;
}
.two{
width: 100px;
height: 100px;
background-color: black;
margin-top: 50px;
}
//上面的元素margin-bottom和下面元素的margin-top會重合。
2.絕對路徑和相對路徑
//絕對路徑:從盤符開始的路徑

相對路徑:相對當前文件所在的路徑
//同級路徑:src: down.jpg
//下一級目錄:src:images/down.jpg
//上一級目錄:src:../down.jpg
2.HTML表單相關元素
2.1一個登錄頁面
例子:
<form>
<p><label for="">賬號</label><input type="text" placeholder="搜索/手機號碼"/></p>
<p><label for="">密碼</label><input type="password"/></p>
<p><label for=""></label><input type="submit"/></p>
</form>
//定義和用法:
<label>標簽為input元素標記。
label元素不會向用戶呈現(xiàn)任何特殊效果,不過,他為鼠標用戶改進了可用性。
如果您在label元素內(nèi)點擊文本,就會觸發(fā)此控件。
label標簽的for屬性應當與相關元素的id屬性相同。
2.2單選框
<d單選框需要給一樣的name名>
例子:
<p>
<label>男</label><input type="radio" name="sex" />
<label>女</label><input type="radio" name="sex" checked="checked"/>
</p>
2.3復合選框
例子:
<p>
<label for="">籃球</label><input type="checkbox"/>
<label for="">破氣球</label><input type="checkbox"/>
<label for="">足球</label> <input type="checkbox "/>
</p>
2.4下拉選框
例子:
<select>
<option value="">洪山區(qū)</option>
<option value="">青山區(qū)</option>
<option value="">武昌區(qū)</option>
2.5預選的下拉選框
//在想要的option上加上select這個屬性
例子:
<select>
<option value="">洪山區(qū)</option>
<option value="" selected>青山區(qū)</option>
<option value="">武昌區(qū)</option>
<textarea name="" id="" cols="30" rows="10"></textarea>
</select>
2.6文本域
<textarea placeholder="看點槽點,不吐不快!別憋著,馬上大聲說出來吧!“></textarea>
 空格
2.7標簽之間的相互轉(zhuǎn)換
display:inline/block/inline/-bolck
2.8display和visiblity的區(qū)別
display:none;
//顯示為沒有
visibility:hiden/visible;
//可見度
visibility:hiden
//事物存在,但是隱藏了
visibility:visible
//事物可以看見
2.9雪碧圖
image.png
例子:
講解登錄框下面的幾個icon.
span{
width:19px;
height:19px;
background:#ccc url(images/icons-sype.png");
background-position:-19px. 0;
}
B我掌握了什么
1.margin的一些小問題
//給子元素margin-top,父元素移動,子元素不移動
解決方案:
1.overflow:hidden;
2.給父元素設置偽元素:one:before{content";
display:table}
*{margin: 0;padding: 0;}
.one {
width: 300px;
height: 300px;
background-color: red;
/*overflow: hidden;*/
}
.one:before{
content: "";
display: table;
}
.two{
width: 100px;
height: 100px;
background-color: black;
margin-top: 50px;
}
>###2.1一個登錄頁面
例子:
<form>
<p><label for="">賬號</label><input type="text" placeholder="搜索/手機號碼"/></p>
<p><label for="">密碼</label><input type="password" placeholder="密碼"/></p>
<p><label for=""></label><input type="submit"/></p></form>
<label>標簽為input元素標記。
label元素不會向用戶呈現(xiàn)任何特殊效果,不過,他為鼠標用戶改進了可用性。
如果您在label元素內(nèi)點擊文本,就會觸發(fā)此控件。
label標簽的for屬性應當與相關元素的id屬性相同。
2.2單選框
<d單選框需要給一樣的name名>
例子:
<p>
<label>男</label><input type="radio" name="sex" />
<label>女</label><input type="radio" name="sex" checked="checked"/>
</p>
2.3復合選框
例子:
<p>
<label for="">籃球</label><input type="checkbox"/>
<label for="">破氣球</label><input type="checkbox"/>
<label for="">足球</label> <input type="checkbox "/>
</p>
2.4下拉選框
例子:
<select>
<option value="">洪山區(qū)</option>
<option value="">青山區(qū)</option>
<option value="">武昌區(qū)</option>
2.5預選的下拉選框
//在想要的option上加上select這個屬性
例子:
<select>
<option value="">洪山區(qū)</option>
<option value="" selected>青山區(qū)</option>
<option value="">武昌區(qū)</option>
<textarea name="" id="" cols="30" rows="10"></textarea>
</select>
2.6文本域
<textarea placeholder="看點槽點,不吐不快!別憋著,馬上大聲說出來吧!“></textarea>
C我沒有掌握什么
//上一級目錄:src:../down.jpg
2.7標簽之間的相互轉(zhuǎn)換
display:inline/block/inline/-bolck
2.8display和visiblity的區(qū)別
display:none;
//顯示為沒有
visibility:hiden/visible;
//可見度
visibility:hiden
//事物存在,但是隱藏了
visibility:visible
//事物可以看見
2.9雪碧圖
image.png
例子:
講解登錄框下面的幾個icon.
span{
width:19px;
height:19px;
background:#ccc url(images/icons-sype.png");
background-position:-19px. 0;
}