HTML5新增input輸入類型，即type後面的值1
文字域
單選按鈕
複選框
下拉清單
密碼域
提交按鈕
可點選按鈕
圖像按鈕
隱藏域
重置按鈕
檔案域
HTML5新增的input輸入類型有
email 類型：用於驗證email的格式，當提交表單時會自動驗證email域的值
，當提交表單時會自動驗證url域的值 日期和時間類型：
HTML5 擁有多個可供選取日期和時間的新輸入類型：
input[type="search"]{
-webkit-appearance:textfield;
}keygen 提供一種驗證使用者的可靠方法。
keygen 元素是金鑰對產生器(key-pair generator)。當提交表單時，會產生兩個鍵，一個是私鑰，一個公鑰。
私鑰(private key)儲存於客戶端，公鑰(public key)則被傳送到伺服器。公鑰可用於之後驗證使用者的客戶端憑證(client certificate)。
目前，瀏覽器對此元素的糟糕的支援不足以使其成為有用的安全標準。
output 用於不同類型的輸出，例如計算或腳本輸出
CSS3新增屬性3
各種內核的瀏覽器都有自己的標準，新增屬性不使各自的標準，所以各家屬性標準前加了一個前綴，如：
-moz- 主要是firefox火狐
box-shadow: 20px 10px 0 #000;
border: 10px solid #000; -moz-border-bottom-colors: #555 #666 #777 #888 #999 #aaa #bbb #ccc; -moz-border-top-colors: #555 #666 #777 #888 #999 #aaa #bbb #ccc; -moz-border-left-colors: #555 #666 #777 #888 #999 #aaa #bbb #ccc; -moz-border-right-colors: #555 #666 #777 #888 #999 #aaa #bbb #ccc;
程式碼：
-moz-border-image: url(exam.png) 20 20 20 20 repeat; -webkit-border-image: url(exam.png) 20 20 20 20 repeat;
:
(1) 20 20. --> 邊框的寬度, 分別對應top, right, bottom, left邊框, 改變寬度可以實現不同的效果;
(2). 邊框圖片效果(目前僅實現了兩種):
repeat ---邊框圖片會平鋪, 類似背景重複;
stretch --- 邊框圖片會以拉伸的方式來鋪滿整個邊框;
(3). 必須將元素的邊框厚度設為非0非auto值.
text-shadow(文字陰影)text-shadow: [<顏色><水平偏移><縱向偏移><><3 = <3值偏移半徑><縱向偏移><模糊半徑><顏色>];
說明:
(1) <颜色>和<模糊半径>是可选的, 当<颜色>未指定时, 将使用文本颜色; 当<模糊半径>未指定时, 半径值为0;
(2) shadow可以是逗号分隔的列表, 如:
text-shadow: 2px 2px 2px #ccc, 3px 3px 3px #ddd;
(3) 阴影效果会按照shadow list中指定的顺序应用到元素上;
(4) 这些阴影效果有可能相互重叠, 但不会叠加文本本身;
(5) 阴影可能会跑到容器的边界之外, 但不会影响容器的大小.
text-overflow(文本截断)
text-overflow: inherit | ellipsis | clip ;
word-wrap(自动换行)
word-wrap: normal | break-word;
border-radius(圆角边框)
-moz-border-radius: 5px;
这个值为圆角的圆的半径值
opacity(不透明度)
opacity: 0.5;
这个值设置为0-1之间的数
box-sizing(控制盒模型的组成模式)
box-sizing: content-box | border-box;
说明:
1. content-box:
使用此值时, 盒模型的组成模式是, 元素宽度 = content + padding + border;
2. border-box:
使用此值时, 盒模型的组成模式是, 元素宽度 = content(即使设置了padding和border, 元素的宽度也不会变).
以上就是关于HTML5和CSS3的几个“新增”的内容，更多相关内容请关注PHP中文网（m.sbmmt.com）！
