原创 引入CSS

Web早期,HTML是一種很有限的語言,這種語言不關心外觀,它只是一種簡潔的小型標記機制。隨着Mosaic網頁瀏覽器的出現,網站開始到處涌現。對於頁面改變外觀的需求增加,於是增加了類似<font>和<big>之類的標記元素。幾年之

原创 CSS層疊

層疊樣式表CSS最基本的一個特性就是層疊。衝突的聲明通過層疊進行排序,由此確定最終的文檔表示。而這個過程的核心就是選擇器及其相關聲明的特殊性、重要性、來源及繼承機制。本文將詳細介紹CSS層疊 特殊性 選擇器的特殊性由選擇器本身的組

原创 紅包效果實現

效果(網絡問題上傳不了gif動態圖片) CSS .zh-chb-main{position: relative;margin: 0.3rem 0.3rem 0;} .zh-chb-main .zh-center{positio

原创 CSS默認可繼承樣式

一直想總結出一份可繼承樣式的列表。常聽說,顏色和字體是可繼承的,盒模型樣式是不可繼承的,但其他樣式呢?本文內容包括所有可繼承的樣式 常用可繼承樣式 color cursor direction font letter-spacin

原创 HTML音頻和視頻

多媒體元素(比如視頻和音頻)存儲於媒體文件中,確定媒體類型的最常用的方法是查看文件擴展名。如.swf、.wmv、.mp3、.mp4 媒體格式 音頻格式 .mid/.midi MIDI (Musical Instrument Dig

原创 DOM操作表格

表格table元素是HTML中最複雜的結構之一。要想創建表格,一般都必須涉及表示表格行、單元格、表頭等方面的標籤。由於涉及的標籤多,因而使用核心DOM方法創建和修改表格往往都免不了要編寫大量的代碼。本文將詳細介紹DOM操作表格的屬

原创 最常用的表單控件input元素的30個元素屬性

form元素只是一個數據獲取元素的容器,而容器內的元素稱爲表單控件。最常用的表單控件是input元素 accept、alt、checked、disabled、maxlength、name、readonly、size、src、typ

原创 HTML中的audio和video

HTML5新增了兩個與媒體相關的標籤,讓開發人員不必依賴任何插件就能在網頁中嵌入跨瀏覽器的音頻和視頻內容,這兩個標籤是<audio>和<video>,且不被IE8-瀏覽器支持 以視頻文件舉例,它包含了音頻軌道、視頻軌道和其他一些元

原创 深入理解HTML表格

在CSS出現之前,table元素常常用來佈局。這種做法在HTML4之後不再推薦使用。而現在有些矯枉過正,使用table展示數據都可能會被說不規範。本文將詳細介紹HTML表格table table 【默認樣式】 //IE7-瀏覽器不

原创 深入理解CSS僞類

僞類經常與僞元素混淆,[僞元素]的效果類似於通過添加一個實際的元素才能達到,而僞類的效果類似於通過添加一個實際的類來達到。實際上css3爲了區分兩者,已經明確規定了僞類用一個冒號來表示,而僞元素則用兩個冒號來表示。本文將詳細介紹僞

原创 CSS兼容性詳解

對於前端工程師來說,不想面對又不得不面對的一個問題就是兼容性。在幾年之前,處理兼容性,一般地就是處理IE低版本瀏覽器的兼容性。而近幾年,隨着移動端的發展,工程師也需要注意手機兼容性了。本文將詳細介紹CSS兼容性 盒模型屬性 【寬高

原创 瞭解HTML表單之form元素

表單是網頁與用戶的交互工具,由一個元素作爲容器構成,封裝其他任何數量的表單控件,還有其他任何<body>元素裏可用的標籤 表單能夠包含<input>、<menus>、<textarea>、<fieldset>、<legend>、<

原创 CSS選擇器

CSS的一個核心特性是能向文檔中的一組元素類型應用某些規則,本文將詳細介紹CSS選擇器 通配選擇器 星號*代表通配選擇器,可以與任何元素匹配 *{color: red;} 元素選擇器 文檔的元素是最基本的選擇器 html{co

原创 簡單的圖片輪播

效果: 功能: 1、左右箭頭切換 2、狀態控制點切換 3、鼠標懸念 4、自動輪播 HTML: <div class="zh-carousel"> <div class="zh-img-list"> <ul

原创 HTML表單美化

由於一些系統原生的表單控件在各個瀏覽器中顯示效果不一致,且無法設置某些關鍵CSS樣式,爲了保證表單在各瀏覽器中的兼容性,表單美化就是不得不做的一件事了 單選按鈕 【實現效果】 【實現過程】 body{ margin: 0