h5和css3有哪些新特性
h5新功能:拖曳釋放API、語意化標籤、音訊和視訊API、畫布API、地理API、表單控制項等。 css3新特性:1、RGBA和HSLA;2、text-shadow;3、border-radius和box-shadow、box-sizing等。
本教學操作環境:windows7系統、CSS3&&HTML5版、Dell G3電腦。
html5是建構Web內容的一種語言描述方式。 html5是網路的下一代標準。 css3是css(層疊樣式表)技術的升級版本。下面我們來看看HTML5餘css3的新功能。
CSS3新特性:
1.顏色:新增RGBA,HSLA模式
2. 文字陰影(text-shadow)
3.邊框: 圓角(border-radius)邊框陰影: box-shadow
#4. 盒子模型:box-sizing
5. 背景:background-size 設定背景圖片的尺寸background-origin 設定背景圖片的原點
background-clip 設定背景圖片的裁切區域,以”,”分隔可以設定多背景,用於自適應佈局
6.漸變:linear-gradient、radial-gradient
7.過渡:transition,可實現動畫
#8. 自訂動畫
9. 在CSS3中唯一引入的偽元素是::selection.
10.媒體查詢,多欄佈局
11. border-image
12.2D轉換:transform:translate(x,y) rotate (x,y) skew(x,y) scale(x,y)
13. 3D轉換
CSS3新增偽類別:
#p:first-of-type 選擇屬於其父元素的首個
元素的每個
元素。
p:last-of-type 選擇屬於其父元素的最後
元素的每個
元素。
p:only-of-type 選擇屬於其父元素唯一的
元素的每個
元素。
p:only-child 選擇屬於其父元素的唯一子元素的每個
元素。
p:nth-child(2) 選擇屬於其父元素的第二個子元素的每個
元素。
:enabled、:disabled 控製表單控制項的停用狀態。
:checked,單選方塊或複選框被選取。
html5 新功能:
1. 拖曳釋放(Drag and drop) API
2. 語意化更好的內容標籤(header ,nav,footer,aside,article,section)
3. 音訊、視訊API(audio,video)
4. 畫布(Canvas) API
#5. 地理(Geolocation) API
6. 本地離線儲存 localStorage 長期儲存數據,瀏覽器關閉後資料不遺失;
7. sessionStorage 的資料在瀏覽器關閉後自動刪除
8. 表單控件,calendar、date、time、email、url、search
9. 新的技術webworker, websocket, Geolocation
更多程式相關知識,請造訪:程式設計入門! !
以上是h5和css3有哪些新特性的詳細內容。更多資訊請關注PHP中文網其他相關文章!

熱AI工具

Undresser.AI Undress
人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover
用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool
免費脫衣圖片

Clothoff.io
AI脫衣器

Video Face Swap
使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱門文章

熱工具

記事本++7.3.1
好用且免費的程式碼編輯器

SublimeText3漢化版
中文版,非常好用

禪工作室 13.0.1
強大的PHP整合開發環境

Dreamweaver CS6
視覺化網頁開發工具

SublimeText3 Mac版
神級程式碼編輯軟體(SublimeText3)

純CSS3怎麼實現波浪效果?這篇文章就來跟大家介紹一下使用 SVG 和 CSS 動畫來製作波浪效果的方法,希望對大家有幫助!

兩種方法:1、利用display屬性,只要為元素加上「display:none;」樣式即可。 2.利用position和top屬性設定元素絕對定位來隱藏元素,只需為元素加上「position:absolute;top:-9999px;」樣式。

H5是指HTML5,是HTML的最新版本,H5是一個功能強大的標記語言,為開發者提供了更多的選擇和創造空間,它的出現推動了Web技術的發展,使得網頁的交互和效果更加出色,隨著H5技術的逐漸成熟和普及,相信它將在互聯網的世界中發揮越來越重要的作用。

在css中,可以利用border-image屬性來實作花邊邊框。 border-image屬性可以使用圖片來建立邊框,即給邊框加上背景圖片,只需要將背景圖片指定為花邊樣式即可;語法「border-image: url(圖片路徑) 向內偏移值圖像邊界寬度outset 是否重複;」。

實作方法:1、使用「:active」選擇器選取滑鼠點擊圖片的狀態;2、使用transform屬性和scale()函數實現圖片放大效果,語法「img:active {transform: scale(x軸放大倍率,y軸放大倍率);}」。

怎麼製作文字輪播與圖片輪播?大家第一想到的是利用js,其實利用純CSS也能實現文字輪播與圖片輪播,下面來看看實作方法,希望對大家有幫助!
