CLion安裝破解教程
阿新 • • 發佈：2020-10-09
引言
HyperText Markup Language:超文字標記語言
作用:檢視層（View）
解釋執行
標籤
作用：在頁面有各式各樣的格式，每個格式對應一個標籤，要想展示樣式必須寫相應的標籤
寫法
<標籤名>被修飾的內容</相同的標籤名> ----標籤對
html檔案的字尾
.html
.htm
相關標籤
1.文字標題標籤
h1:一級標題
h2:二級標題
h3:三級標題
h4:...
h5:...
h6:...
<p> 只展示內容,不保留文字格式 </p> 換行:<br/> 空格: 心:♥ <pre> 展示內容,保留文字格式 </pre>
<font>被修飾的字型</font> size:字型大小 color:字型顏色 屬性:對標籤樣式的進一步修飾 屬性名="屬性值" <標籤名 屬性名="屬性值" ></標籤名>
有序列表 <ol> <li>抽菸</li> <li>喝酒</li> <li>燙頭</li></ol> 無序列表 <ul> <li>如花</li> <li>似玉</li> <li>範大頭</li> </ul>
<img src="指明展示圖片的路徑"/> width:寬 數字px:佔多少畫素 80%:佔瀏覽器總寬的80% height:高 數字px:佔多少畫素 <!-- 例子 --> <img src="img/3A76F0FECF510C306DB66B28D174A415.jpg" width="80%" />
畫三行三列表格------>三行,每行三個單元格 <!-- 三行三列 三行,每行三個單元格 --> <table border="1px"> <tr> <td>姓名</td> <td>性別</td> <td>年齡</td> </tr> <tr> <td>範大頭</td> <td>???</td> <td>84</td> </tr> <tr> <td>王XX</td> <td>女</td> <td>16</td> </tr> </table>
語法:
table:根標籤
border:邊框 1px --->邊框有一個畫素的寬
align:居中位置 left|center|right 整個表格相對於瀏覽器位置
width:寬
height:高
bgcolor:背景顏色
tr:行
align:居中位置 left|center|right 行中的資料相對於行的位置
height:高
行沒有width屬性,因為行的寬與表格的寬相同
td:單元格
rowspan:向下合併單元格
colspan:向右合併單元格
bgcolor:背景顏色
根標籤:
<form action="指定內容傳送的後臺地址"> //表單的元素控制元件 </form>
<input type="text"/>
屬性:
value 預設值
readonly 只讀,不能修改
hidden: 隱藏
placeholder:提示
<input type="password" /> 屬性: value 預設值 readonly 只讀,不能修改 hidden: 隱藏 placeholder:提示
<input type="radio" /> 屬性: name:同一組單選框,name屬性值必須要相同 value:是單選框的值,日後單選框向後臺傳送的值 checked:預設被選中
<input type="checkbox"/> 屬性: name:同一組複選框,name屬性值必須要相同 value:是複選框的值,日後複選框向後臺傳送的值 checked:預設被選中
<select> <option>選項1</option> <option>選項2</option> <option>選項3</option> <option>選項4</option> </select> selected:預設被選中
<textarea></textarea>
<input type="file" />
普通按鈕: <input type="button" value="按鈕上面的展示內容"/> 重置按鈕: <input type="reset"/> 將表單內容返回為預設內容 提交按鈕: <input type="submit" /> 提交表單內容
如何提交資料
2.form標籤必須有action屬性
3.所有元素控制元件都要新增name屬性
2.值與值之間是用&分割
作用:將要提交的資料拼接在路徑之後
2.post提交
作用:開闢儲存空間,打包提交
使用:
1.提交的資料,隱私較多,post好,post提交不會將提交內容顯示出來
2.提交的資料少,沒有什麼隱私, get好,get提交效率高
CSS
cascade stylesheet:級聯樣式列表
作用:美化網頁
引入方式
行內引入
<標籤 style="屬性值:屬性名;"></標籤> css的屬性 color:修改字型顏色 font-size:修改字型的大小 font-family:隸屬 楷書
<html> <head> <style type="text/css"> 選擇器{ color:red; .... } </style> </head> <body> <p 選擇器> 第一段 </p> </body> </html>
標籤名{
屬性名:屬性值;
屬性名2:屬性值2;
}
2.類選擇器
<style> .類名(隨意寫){ 屬性值:屬性名; } </style> <font class="類名"></font> <p class="類名"></p>
①.一個標籤可以使用多個類選擇器
3.id選擇器
<style> #id值(隨意寫){ 屬性名:屬性值; } </style> <p id="id值"></p>
①.每個標籤的id值不可重複
4.偽類選擇器
<style> 隨便選擇器:hover{ 屬性名:屬性值 } </style> <p 隨便選擇器 ></p>
5.父子選擇器
外部引入
做法:
1.建立一個 .css結尾的檔案,在檔案中編寫樣式
2.在head標籤中引入css檔案
<head> <link rel="stylesheet" href="css檔案的路徑" /> </head>
①文字相關
font-size 設定字型大小
font-family 設定字型(隸書,楷書)
color 設定字型顏色
text-decoration: none(無下劃線)|underline(有下劃線) 設定下劃線是否存在(超連結)
②邊框相關
border: 寬度 顏色 樣式
③背景相關
background-image:url(圖片路徑) 設定背景圖片
background-repeat:no-repeat|repeat-x|repeat_y|retpeat 設定背景圖片平鋪效果
background-posotion:center|left|right 設定背景圖片的居中位置
background-color 設定背景顏色
④滑鼠相關
cursor:point