01
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<form action="" method="">
<!--可以提交表單收集的信息
action 提交信息的位置,也是接口
method 提交方式-->
<input type="" name="" id="" value="" placeholder=""/>
<!--type 屬性: txet--普通的文本輸入
name--必須設(shè)置,用于提交信息
value--輸入框的內(nèi)容
placeholder--占位符,輸入信息提示用
屬性: password 密碼輸入,密文顯示
屬性: radio(單選框)
name---同一類型,名字必須相同
name 同一類型的那么必須相同,
value---
check : 默認(rèn)設(shè)置選中按鈕提交的值
屬性: checkbox (多選)
name---統(tǒng)一類型必須相同
屬性 : button(按鈕)
屬性: reset 重制from中所有的表單相關(guān)標(biāo)簽對(duì)應(yīng)的值(回到最初的狀態(tài))
-->
</form>
</body>
</html>
02
<!--嘿嘿,走過(guò)的路,都要變成風(fēng)景.-->
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<form action="" method="post">
<!--一個(gè)fieldset標(biāo)簽對(duì)應(yīng)一個(gè)表達(dá)分組-->
<fieldset id="">
<legend>1</legend>
</fieldset>
<!--下拉菜單-->
<select name="">
<option value="">成都</option>
<option value="">重慶</option>
<option value="">北京</option>
<option value="">大連</option>
<option value="" selected="selected">青島</option> <!--默認(rèn)選中-->
</select>
<!--多行文本域()-->
<textarea name="" rows="2" cols="50"></textarea>
<input type="submit" value=""/>
</form>
</body>
</html>
03
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<!--htlm中的標(biāo)簽分為
塊級(jí)標(biāo)簽: 一行只能有一個(gè)(不管標(biāo)簽的寬度)
h1--h6 p標(biāo)簽 hr標(biāo)簽 列表 , 表格
行內(nèi)標(biāo)簽: 一行寫多個(gè)
a img input 下拉列表 ,多行輸入框
-->
<!--空白標(biāo)簽:沒(méi)有任何的意義,(無(wú)語(yǔ)義標(biāo)簽)-->
<div id="">
</div>
<span id="">
</span>
<body>
</body>
</html>
04
<!--學(xué)習(xí)能力太差,所以才來(lái)培訓(xùn)吧.自制力也差,所以又來(lái)培訓(xùn)把-->
<!--
1.CSS是web標(biāo)準(zhǔn)中,用設(shè)置網(wǎng)頁(yè)的樣式(長(zhǎng)得樣子)
CSS文件CSS代碼叫做樣式表,目前我們使用的是CSS3
網(wǎng)頁(yè)布局,樣式
2.寫在那?
A.內(nèi)部樣式表: 將CSS代碼寫在標(biāo)簽的style屬性中
B. 寫在head的style中 里面有是元素選擇器
C. 外部寫CSS文件 link連接
3. 怎么寫
A.選擇器(屬性:屬性值;屬性:屬性值)
B. 寫在head的style中 里面有是元素選擇器:選中需要設(shè)置樣式的標(biāo)簽
C. 屬性: 外部寫CSS文件 link連接
屬性補(bǔ)充: color--字體顏色 bgcolor--背景顏色 width--標(biāo)簽寬度 height--標(biāo)簽高度
優(yōu)先級(jí): 內(nèi)聯(lián)的優(yōu)先級(jí)最高,內(nèi)部和外部沒(méi)有絕對(duì)的優(yōu)先級(jí),主要看同一個(gè)屬性是誰(shuí)最后賦值,誰(shuí)就有效
-->
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<!--專門用來(lái)設(shè)置樣式的標(biāo)簽-->
<style type="text/css">
div{/*元素選項(xiàng)器*/
background-color: yellow;
}
</style>
<!--關(guān)聯(lián)外部樣式表-->
<link rel="stylesheet" type="text/css" href="css/css1.css"/>
</head>
<body>
<div id="">
說(shuō)我是
</div>
</body>
</html>
05
<!--
1.標(biāo)簽選擇器
選中所有的標(biāo)簽對(duì)應(yīng)的標(biāo)簽
2.id 選擇器
語(yǔ)法: #id屬性值
每個(gè)標(biāo)簽都有一個(gè)id屬性,整個(gè)HTMl中,id的值必須唯一
3.class選擇器
語(yǔ)法: .class屬性值
每個(gè)標(biāo)簽都有一個(gè)class屬性
4.通配符: *號(hào)
選中所有的標(biāo)簽
5.層級(jí)選擇器
語(yǔ)法: 選擇器1 選擇器2 ...
6.群組選擇器
同時(shí)選中想選擇的標(biāo)簽,用逗號(hào)隔開(kāi)
-->
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
#a1{
color:rgb(255,0,0);/*1.顏色英語(yǔ)單詞 2. 16進(jìn)制的顏色值 00-ff 前面加#號(hào) 3. rgb值 一.rgb() 二.rgba() */
}
.c1{
color: blue;
}
</style>
</head>
<body>
<a href="" id="a1">我是</a>
<p class="c1">我是</p>
<div id="">
我是
</div>
</body>
</html>
06
<!--
語(yǔ)法: 選擇器:偽類選擇器
1. :link
對(duì)應(yīng)的是超鏈接的初始狀態(tài),(一次都沒(méi)有訪問(wèn)成功的狀態(tài))
2. :visited
超鏈接訪問(wèn)后的狀態(tài)
3. :hover
鼠標(biāo)懸停在標(biāo)簽時(shí)對(duì)應(yīng)的狀態(tài)
4. :active
鼠標(biāo)按下的狀態(tài)
愛(ài)恨原則:
給同一個(gè)標(biāo)簽設(shè)置通過(guò)偽類選擇器給不同狀態(tài)設(shè)置不同的樣式
-->
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
</body>
</html>
