css3和html5的基礎

2021-07-08 15:16:21 字數 2649 閱讀 2542

流式布局

應對視窗大小做等比例縮放布局

//簡單來說利用百分數來進行布局

css3的box-sizing與calc()

通常設定邊框會被設定在元素的外圍

box-sizing屬性值設為border-box時邊框就加在元素內部

css3中在進行響應式布局時需要對不不同的螢幕大小設定不同的div排序方式。

這時候後我們就會遇到乙個問題,怎麼讓我們的裝置知道在什麼情況下應該載入那一部分的css樣式

這時我們又可以用到下面乙個方法,就是用@media來規定在什麼在什麼情況下開始執行這一段css。當然為了減少css的**量。我們可以將一些不會變化樣式放在media的括號外,這樣他就會在螢幕任何大小時都執行這段css.

接下去要講的是我最近在寫樣式時發現的一些疑難和解決方法

margin 和 float同時使用會使float失效

當我們使用padding時會使整個div大小變大

設定background 的 gradient屬效能產生顏色漸變的效果

要設定不換行   使用white_space:nowrap;

css的動畫效果並不是所有的瀏覽器都支援

做**的時必須考慮到**的適配性。不能過於追求炫酷的效果,而使自己的**具有侷限性。

設定opacity屬性時必須知道  ie對這個屬性不能良好的支援。

還有就是講一些html5的標籤的問題

換行符的標準寫法

不用加關閉標籤,當然加了也是沒錯的

是副標題的意思

棄用了在html 4中使用的屬性

使用該屬性的元素

在html 5中的替代方案

revlink、a

relcharset

link、a

在被鏈結的資源的中使用http content-type頭元素

shape、coords a

使用area元素代替a元素

longdesc

img、iframe

使用a元素鏈結到校長描述

target

link

多餘屬性,被省略

nohref

area

多餘屬性,被省略

profile

head

多餘屬性,被省略

version

html

多餘屬性,被省略

name

imgidscheme

meta

只為某個表單域使用scheme

archive、chlassid、codebose、codetype、declare、standby

object

使用data與typc屬性類呼叫外掛程式。需要使用這些屬性來設定引數時,使用param屬性

valuetype、type

param

使用name與value屬性,不宣告之的mime型別

axis、abbr

td、th

使用以明確簡潔的文字開頭、後跟詳述文字的形式。可以對更詳細內容使用title屬性,來使單元格的內容變得簡短

scope td

在被鏈結的資源的中使用http content-type頭元素

align

caption、input、legend、div、h1、h2、h3、h4、h5、h6、p

使用css樣式表替代

alink、link、text、vlink、background、bgcolor

body

使用css樣式表替代

align、bgcolor、border、cellpadding、cellspacing、frame、rules、width

table

使用css樣式表替代

align、char、charoff、height、nowrap、valign

tbody、thead、tfoot

使用css樣式表替代

align、bgcolor、char、charoff、height、nowrap、valign、width

td、th

使用css樣式表替代

align、bgcolor、char、charoff、valign tr

使用css樣式表替代

align、char、charoff、valign、width

col、colgroup

使用css樣式表替代

align、border、hspace、vspace

object

使用css樣式表替代

clear br

使用css樣式表替代

compace、type

ol、ul、li

使用css樣式表替代

compace dl

使用css樣式表替代

compace

menu

使用css樣式表替代

width

pre使用css樣式表替代

align、hspace、vspace

img使用css樣式表替代

align、noshade、size、width hr

使用css樣式表替代

align、frameborder、scrolling、marginheight、marginwidth

iframe

使用css樣式表替代

autosubmit

menu

HTML5與CSS3基礎(五)

16表單 16.1輸入和元素 16.2建立表單 每個表單都已form開始標籤開始,以form結束標籤結束。兩個標籤之間是組成表單的說明標籤 控制項和按鈕,每乙個控制項都有乙個name屬性,用於在提交表單時對資料進行識別。form開始標籤可以有一些屬性,其中最重要的就是action和method ac...

html5和css3新特性

1易用簡潔 指令碼和連線無需type html5新增加的一些標籤和特性如下 1.無需寫type,指令碼和連線 2.新增加標籤標記元素mark高亮顯示 audio video 如下figure input新增屬性 placeholder required autofocus 新增正規表示式在input...

HTML5和CSS3核心總結

window.localstorage 儲存沒有截止日期的資料 儲存資料 法2 localstorage.key value 法3 localstorage key value 取出資料 法2 localstorage.key 法3 localstorage key 其他方法 window.sess...