黑馬程序員pink老師前端入門教程,零基礎(chǔ)必看的h5(html5)+css3+移

<a href="www.baidu.com" target="_self">百度</a>
target:_blank 新的窗口打開
target:_self 當(dāng)前窗口打開
- 內(nèi)部鏈接
- 空鏈接 ‘#”
- 下載鏈接:地址鏈接的是文件exe/壓縮包zip等,會(huì)下載這個(gè)文件
- 網(wǎng)頁元素鏈接:文本/圖像/視頻/表格等都可以添加超鏈接
錨點(diǎn)鏈接:點(diǎn)擊鏈接,可以快速定位到頁面中某個(gè)位置,<a href="#xxx"> </a> id="xxx“

- 空格
- < >
- <table> <tr><td>
- tr代表行
- td代表列
- th代表表頭單元格- 文字加粗居中
表格屬性
- align (left/center/right) 設(shè)置表格居中
<table align="center" border="1" cellpadding="2" cellspacing="0" width="500" height="1000"></table>
- border:單元格邊框,默認(rèn)0
- cellpadding:文字與單元格距離,默認(rèn)1
- cellspacing:單元格與單元格的距離,默認(rèn)2

- <thead><tr>....</tr></thead>
- <tbody><tr>...</tr></tbody>
- thead:表格頭部區(qū)域,包含tr
- tbody:表格主體區(qū)域,包含tr
- 跨行合并:rowspan="合并單元格的個(gè)數(shù)"
- 跨列合并:colspan="合并單元格的個(gè)數(shù)”
- 目標(biāo)單元格:
- 跨行:最上側(cè)單元格 <td colspan="2">
- 跨列:最左側(cè)單元格<td rowspan="2">
- 刪除多余單元格
- 無序列表<ul><li>xxx</li></ul>
- li可以包含所有元素
- 有序列表<ol><li>xxx</li></ol>
- 自定義列表
<dl><dt><dd>
- dl
- dt:名字
- dd:圍繞dt解釋
dt與dd并列關(guān)系
- 表單=表單域+表單元素+提示信息
- 表單域:包含表單元素的區(qū)域,例如form
- <form action="demo.php" method="post" name="name1"></form>
input:<input type="text" name="xxx" value=”xxx“ maxlength="6"> 單標(biāo)簽
- :text
- password
- radio name=“xxx" 必須有相同的name才能實(shí)現(xiàn)單選
- checkbox name=“xxx" 必須有相同的name才能實(shí)現(xiàn)多選
- name和value是每個(gè)表單元素都有的屬性值,供后臺(tái)人員使用
- 單選按鈕和復(fù)選按鈕可以設(shè)置checked屬性
checked="checked"
- maxlength="6"
- submit:表單域數(shù)據(jù)提交到后臺(tái)
<input type="submit" value="免費(fèi)注冊">
- reset:<input type="reset" value="重置">
- button:與JS搭配使用
<input type="button" value="xxx">
- file:文件域?22-label標(biāo)簽 P53 - 00:28?
- label:標(biāo)簽為input元素定義標(biāo)簽,與表單元素綁定,當(dāng)點(diǎn)擊<lablel>標(biāo)簽內(nèi)的文本時(shí),瀏覽器會(huì)自動(dòng)將焦點(diǎn)轉(zhuǎn)到對應(yīng)的表單元素上,增加用戶體驗(yàn)。
- 語法:
- <label for="sex”>男<label>
<input type=’radio" name="sex" id="sex"/> for屬性與相關(guān)元素的id屬性相同
- <select><option selected=“selected"> 在form中
- 可以多行輸入
<form><textarea rows="3" cols="50">
- 超出行列會(huì)添加滾動(dòng)條
- 標(biāo)簽選擇器 p div等
.red{
color: red
}
<li class="red">
*{ 所有元素標(biāo)簽都應(yīng)用
}

h標(biāo)簽需要單獨(dú)指定樣式
font-weight:normal=400 bold=700
font-style:italic 斜體 normal:正常
font: font-style font-weight font-size/line-height font- family(必須保留font-size 和font-family,否則font不起作用)
- none
- underline:下劃線
- overline:上劃線
- line-through:刪除線
text-indent:段落首行縮進(jìn),文本首行縮進(jìn),可以取負(fù)值
text-indent:2em 當(dāng)前元素一個(gè)單位,是相對當(dāng)前元素來講,如果沒有設(shè)置size,默認(rèn)繼承父元素的size
行間距=上間距+文本高度+下間距

- 內(nèi)部樣式表:css寫在style里邊?25-行內(nèi)樣式表 P85 - 00:03?
- 行內(nèi)樣式表:css寫在標(biāo)簽內(nèi)部
- 外部樣式表:單獨(dú)CSS文件



圖片水平居中,要在圖片的父元素添加水平居中
























- display:inline-block
- display:block
- display:inline


元素背景顏色默認(rèn)為transparent(透明)





