html和css總結

表單標籤:

form標籤

action:表單最終提交的地址(url)/提交的某個頁面中
                        method:提交的方式
                        get方式:
                                1)它提交後,用戶的敏感數據會顯示在地址欄中,不安全的
                              2)提交的用戶數據大小是有限制的,不超過1kb
                                post方式
                                1)它提交後,用戶的信息不會顯示在地址欄中
                                        2)提交用戶數據大小沒有限制,還是(小文件)

<!DOCTYPE html>
<html>
<head>
<meta charset="{CHARSET}">

<title>test</title>

</head>
<body>
<form action="#" method="post">
用戶名:<input type="text" name="username" value="請輸入3-12位字母或者數字" /> <br />
密&nbsp;&nbsp;碼:<input type="password" name="password" value="請輸入6-16位字母或者數字" /> <br />
<input type="submit" value="提交" />

</form>
</body>
</html>

表單中常用的:
        文本輸入框:<input type="text" name="" /> 
            密碼輸入框:<input type ="password"/>
            單選框: <input type ="radio" /> <input type="radio" name="gender" value="男" /> 男
            複選框: <inpyt type ="checkbox"/>   <input type="checkbox" name="hobby" value="籃球" />籃球
            下拉菜單:<select name=""></select> 

       <select name="address"> 

<option value="陝西">陝西</option>

< /select>


            上傳文件:<input type="file" name=""/> <input type="file" name="1.txt" />
            文本輸入域:<textarea></textarea>
            按鈕:<input type="button" value="" />
            提交:<input type = "submit" />
            重置:<input type="rest" value="重置"/

框架標籤:

frameset不能和body共存
row屬性:按行的方向劃分:從上往下劃分 劃分的每個頁面佔整個部分的白分比
    cols屬性:按列的方向劃分 從左往右劃分 劃分的每個頁面佔整個部分

name屬性 :name屬性值和超鏈接中的target屬性值一致
            超鏈接必須在當前中間頁面顯示在CSS 定義中,

a:hover 必須被置於 a:link 和 a:visited 之後,纔是有效的。

在 CSS 定義中,a:active 必須被置於 a:hover 之後,纔是有效的。
        link--visited--hover---active

向文本增加修飾

text-decoration屬性

屬性值:
none:沒有下劃線
underline:下劃線
overline:上劃線
line-through:中劃線  場景:購物 原價中間有中劃線!

CSS字體以下常用屬性
font-family:字體類型
用戶設置的字體類型,必須是系統庫中存在的字體類型,如果系統庫中找不到這個字體類型,默認宋體
font-family:"楷體" ;
font-size:設置字體的大小
font-size:20px
font-style  設置字體樣式
normal:(默認)正體
italic:斜體
  font-style:normal ;
font-weight:給字體設置粗細:
bold:給字體適當加粗
font-weight:bold;
font的簡寫屬性
font:字體的樣式(normal/italic) 字體的粗細(bold) 字體的大小(font-size) 字體的類型(font-family)
 font:italic bold 24px "楷體"; 

邊框顏色:border-color:四個邊框的顏色*/

border-top-color:#F00;
border-left-color:#0F0 ;
border-right-color:#00F;
border-bottom-color:#00F;


邊框顏色的簡寫屬性
默認的方向:上 右  下 左 進行設置的
如果邊框中又一邊顏色沒有設置,那麼它會補對面的顏色!
border-color:#F00  ;
邊框寬度:border-width:四個邊框的寬度
border-top-width:10px ;
border-left-width:20px ;
border-right-width:30px ;
border-bottom-width:40px ;
邊框寬度的簡寫屬性
上 右 下 左
某一邊沒有設置邊框寬度,補對邊的寬度
border-width:10px ;
注意;邊框要顯示效果,光有邊框顏色和邊框的寬度是不行的,還需要指定一個屬性
邊框的樣式:
border-style:四個邊框的樣式
以下幾個值:
solid:單實線
dashed:虛線
dotted:點
double:雙實線
border-top-style:solid ;
border-left-style:dashed;
border-right-style:dotted ;
border-bottom-style:double ;



發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章