您現在的位置: 365建站網 > 365教程 > CSS3教程 > CSS3 用戶界面

CSS3 用戶界面

此節有 109 人學習過     參與評論

CSS3 用戶界面

CSS3 中,新的用戶界面特性包括重設元素尺寸、盒尺寸以及輪廓等。

在本章中,您將學到以下用戶界面屬性:

  • resize
  • box-sizing
  • outline-offset

瀏覽器支持

屬性 瀏覽器支持
resize
box-sizing
outline-offset

Firefox、Chrome 以及 Safari 支持 resize 屬性。

Internet Explorer、Chrome、Safari 以及 Opera 支持 box-sizing 屬性。Firefox 需要前綴 -moz-。

所有主流瀏覽器都支持 outline-offset 屬性,除了 Internet Explorer。

CSS3 Resizing

在 CSS3,resize 屬性規定是否可由用戶調整元素尺寸。

這個 div 元素可由用戶調整尺寸(在 Firefox 4+、Chrome 以及 Safari 中)。

CSS 代碼如下:

實例

規定 div 元素可由用戶調整大?。?/p>

div
{
resize:both;
overflow:auto;
}

親自試一試

CSS3 Box Sizing

box-sizing 屬性允許您以確切的方式定義適應某個區域的具體內容。

實例

規定兩個并排的帶邊框方框:

div
{
box-sizing:border-box;
-moz-box-sizing:border-box;	/* Firefox */
-webkit-box-sizing:border-box;	/* Safari */
width:50%;
float:left;
}

親自試一試

CSS3 Outline Offset

outline-offset 屬性對輪廓進行偏移,并在超出邊框邊緣的位置繪制輪廓。

輪廓與邊框有兩點不同:

  • 輪廓不占用空間
  • 輪廓可能是非矩形

這個 div 在邊框之外 15 像素處有一個輪廓。

CSS 代碼如下:

實例

規定邊框邊緣之外 15 像素處的輪廓:

div
{
border:2px solid black;
outline:2px solid red;
outline-offset:15px;
}

親自試一試

新的用戶界面屬性

下面的表格列出了所有的轉換屬性:

屬性 描述 CSS
appearance 允許您將元素設置為標準用戶界面元素的外觀 3
box-sizing 允許您以確切的方式定義適應某個區域的具體內容。 3
icon 為創作者提供使用圖標化等價物來設置元素樣式的能力。 3
nav-down 規定在使用 arrow-down 導航鍵時向何處導航。 3
nav-index 設置元素的 tab 鍵控制次序。 3
nav-left 規定在使用 arrow-left 導航鍵時向何處導航。 3
nav-right 規定在使用 arrow-right 導航鍵時向何處導航。 3
nav-up 規定在使用 arrow-up 導航鍵時向何處導航。 3
outline-offset 對輪廓進行偏移,并在超出邊框邊緣的位置繪制輪廓。 3
resize 規定是否可由用戶對元素的尺寸進行調整。 3

如對本文有疑問,請提交到交流論壇,廣大熱心網友會為你解答??! 點擊進入論壇


發表評論 (109人查看,0條評論)
請自覺遵守互聯網相關的政策法規,嚴禁發布色情、暴力、反動的言論。
用戶名: 驗證碼: 點擊我更換圖片
最新評論
------分隔線----------------------------
自拍偷拍福力视频,偷拍国际精品,麻豆一区福利电影,国产网红视频午夜福利,se视频大全,久久国产AV影院 亚洲日本人成网站在线播放| 日本av亚洲色在线观看| 日本动漫爆乳h动漫无遮挡| 日本古代十大酷刑qvod| 4080yy理论片在线播放日本高清| 国产成人亚洲综合app网站| 6一12泑女www| 久久电影院| 人妻无码av一区二区三区精品| 无码人妻人妻经典| 翁熄系列乱老扒| 天堂视频的在线| 免费看12萝裸体视频国产| av无码天堂一区二区三区| 女同桌的手总是放在我的鸡上| 日本的人人为我我为人人| 边做饭边被躁在线播放| 欧美videosfreeⅹ尸交| 女性裸身照无遮| 粗大猛烈进出高潮视频| 国产成人免费无庶挡视频| japanassexvideos在线| 午夜片无码区在线观看爱情网| 末成年美女黄网站色应用大全| 2012年中文字幕在线| 久久影院| 亚洲av永久无码嘿嘿嘿| old欧美老妇videos| 国内视频在线观看视频| 动漫无遮羞视频在线观看| 天堂2017在线观看| http://www.goldoption168.net