HTML5入門新特性
HTML5的發展越來越邁向成熟,很多的應用已經逐漸出現在你我日常生活中了,不只讓傳統網站上的互動Flash逐漸的被HTML5的技術取代,更重要的是可以透過HTML5的技術
CSS3圓角代碼
CSS3實現圓角的代碼如下:<style type="text/css">.rounded-corner-keleyi-com {
HTML5錨點請用id代替name
HTML5已經去掉name屬性,實現錨點時請使用id,實例效果:http:///keleyi/phtml/html5/9.htm支持Chrome,火狐,IE8以上等浏覽器
使用CSS3畫愛心
請使用支持CSS3的浏覽器,例如Chrome,IE9以上,火狐。效果如下:.heart_keleyi_com{width:160px;height:200px;posit
html 5簡易的影片播放器
<!DOCTYPE html ><html ><head><meta http-equiv="Content-Type
HTML5/CSS3實現側邊欄收放
效果體驗:http:///keleyi/phtml/html5/11.htm請使用支持HTML5的浏覽器以下是完整代碼:<!DOCTYPE html PUBLIC
css3 各種紙張貼紙效果
請使用支持CSS3的浏覽器查看效果:*{margin: 0;padding:0;} body {margin: 0; padding: 20px 100px
HTML5最基本的橫行菜單代碼
請使用支持HTML5的浏覽器查看效果: body, ul, li, a { margin: 0; padding: 0; }
CSS3制作立體動畫導航菜單
效果如下(請使用支持CSS的浏覽器查看):.keleyi-com-nav{width:580px;height: 50px;font:bold 0/50px Arial;
HTML5煙花特效
煙花效果如下(請使用支持HTML5的浏覽器查看):canvas{background-color:#000000;;z-index:9999;}也可以點擊這裡查看效果:h
純CSS3實現3D跳動小球
請使用Chrome,火狐的浏覽器查看本頁面,使用IE將看不到效果。因為這裡使用了IE條件樣式,詳情參看考:http:///a/bjac/rfdq8099.htm和http
jquery和css3實現滑動導航菜單
效果預覽:http:///keleyi/phtml/html5/15/有都中顏色可供選擇,請使用支持HTML5/CSS3的浏覽器訪問。HTML源代碼:<!DOCTY
css3提示框
請使用支持CSS3的浏覽器查看本頁。 :first-child:after { content:; position:absolute; z-index:1; bo
CSS3+jQuery實現3D下拉菜單
效果預覽:http:///keleyi/phtml/css3menu/index.htmHTML文件代碼:<!doctype html><html>
CSS3 動畫
CSS3 動畫通過 CSS3,我們能夠創建動畫,這可以在許多網頁中取代動畫圖片、Flash 動畫以及 JavaScript。先看一個示例,載入頁面後,方塊會變色、轉動和移
HTML5火焰特效
本示例通過Javascript使用HTML5的canvas元素,在屏幕上顯示一個跳動的火焰。請使用支持HTML5的浏覽器查看本頁面。也可以點擊這裡查看效果:http://
HTML5用本地存儲localStorage記錄用戶訪問頁面次數
HTML5 提供了兩種在客戶端存儲數據的新方法:localStorage - 沒有時間限制的數據存儲sessionStorage - 針對一個 session 的數據存儲
jQuery實現HTML5時鐘
查看效果:http:///keleyi/phtml/html5/17.htmjQuery實現HTML5時鐘,有日期,請使用支持HTML5/CSS3的浏覽器查看。其中jQu
CSS3 box-shadow 屬性
定義和用法box-shadow 屬性向框添加一個或多個陰影。默認值: none繼承性: no版本: CSS3JavaScript 語法: object.style.box
-moz-box-shadow
為什麼不直接用box-shadow,而要用-moz-box-shadow呢?還有-webkit-box-shadow?box-shadow是CSS3新增的效果,一開始並不