CSS3使用者介面

2021-07-10 01:26:56 字數 1182 閱讀 5171

使用者介面

css3

規範新增了

ui模組,該模組用來控制與使用者介面相關效果的呈現方式,詳細資料參閱

css3-ui/。

css3對盒模型進行了改善,定義了

box-sizing

屬性,該屬性能夠事先定義盒模型的尺寸解析方式,基本語法如下所示:

box-sizing:content-box|border-box|inherit;

resize

屬性允許使用者通過拖動的方式來修改元素的尺寸,語法如下所示:

resize:none|both|horizontal|vertical|inherit;

outline

屬性可以定義塊元素的外輪廓線,基本語法如下所示:

outline:[outline-color]||[outline-style]||[outline-width]||[outline-offset]|inherit

html

為表單標籤定義

tabindex

屬性,這個屬性為當前元素指定了其在當前文件中導航的序列號。

css定義了切換焦點的控制順序方向鍵特性,主要由

4個屬性來配合實現:

content

屬性屬於內容生成和替換模組,該屬性能夠為指定元素新增內容,基本語法如下:

content

:normal|string|attr()|uri()|counter()|none;

css3

新增乙個

initial

屬性,使用這個屬性值可以直接取消對某個元素的樣式指定。

overflow

屬性定義當乙個塊級元素的內容溢位了元素的框時是否剪下顯示,

overflow-x

屬性定義了對左右邊(水平方向)的剪下,

overflow-y

屬性定義了對上下邊(垂直方向)的剪下。

基本語法如下所示:

overflow-x:visible|hidden|scroll|auto|no-display|no-content;

overflow-y:visible|hidden|scroll|auto|no-display|no-content;

cssreflections

執行css

設計倒影效果。

box-reflect

屬性能夠實現投影效果。

CSS3 增強使用者介面

box sizing resize outline width outline style outline color outline 常見使用者介面屬性 本節重點主要介紹以下的使用者介面屬性 瀏覽器支援,如下圖所示 resize屬性規定使用者是否可以調整元素尺寸,常用屬性值如下 注意 如果希望此屬...

CSS3 增強使用者介面

前言 在 css3 中,增加了一些新的使用者介面特性來調整元素尺寸 框尺寸 外邊框等,本節來依次介紹下。內容 主要介紹以下的使用者介面屬性 瀏覽器支援,如下圖所示 resize屬性規定使用者是否可以調整元素尺寸,常用屬性值如下 注意 如果希望此屬性生效,需要設定元素的 overflow 屬性,值可以...

CSS3多列和使用者介面

css3 多列 建立多個列來對文字進行布局 就像報紙那樣 column count 3 把 div 元素中的文字分隔為三列 column gap 70px 規定列之間的間隔 column rule 1px outset ff0000 規定列之間的寬度 樣式和顏色規則 css3 使用者介面 resiz...