你的圖片如果是全屏背景的話，可以獲取瀏覽器窗口的寬和高，如果不是占滿而只是其中的一部分，用上面說的辦法獲取相應(yīng)的父元素的寬和高，再設(shè)置圖片或者h(yuǎn)tml5canvas的寬和高這樣你看，不管你是用普通的img元素，還是用html5畫布，都可以自適應(yīng)瀏覽器窗口的分辨率關(guān)于作圖大小的問題要看你的需求；八圖片的自適應(yīng)fluid image除了布局和文本，quot自適應(yīng)網(wǎng)頁設(shè)計(jì)quot還必須實(shí)現(xiàn)圖片的自動(dòng)縮放這只要一行CSS代碼img maxwidth 100% 這行代碼對(duì)于大多數(shù)嵌入網(wǎng)頁的視頻也有效，所以可以寫成img， object maxwidth 100% 老版本的IE不支持maxwidth，所以只好寫成img width 100。

1，輸入positionfixedtop0left0將整個(gè)div固定在屏幕的頂部和左側(cè)2輸入width100％height100％min－width1000px這個(gè)可以適合div的高度和寬度，而min－width是為了實(shí)現(xiàn)讓屏幕寬度在1000px以內(nèi)時(shí)，div的大小保持不變3輸入backgroundsize coverwebkitbackgroundsize；3平臺(tái)無關(guān)性雖然個(gè)人計(jì)算機(jī)大行其道，但使用MAC等其他機(jī)器的大有人在，超級(jí)文本標(biāo)記語言可以使用在廣泛的平臺(tái)上，這也是萬維網(wǎng)。

自適應(yīng)網(wǎng)站是一種利用HTML5技術(shù)，通過檢測(cè)屏幕尺寸自動(dòng)調(diào)整布局的設(shè)計(jì)方式，也被稱為響應(yīng)式設(shè)計(jì)它的核心特點(diǎn)是，無論在PC手機(jī)還是IPAD上，只需一套代碼就能實(shí)現(xiàn)無縫適應(yīng)，無需單獨(dú)為每個(gè)平臺(tái)開發(fā)，大大簡(jiǎn)化了維護(hù)工作這種設(shè)計(jì)對(duì)搜索引擎特別友好，特別是對(duì)百度為了明確告知百度頁面的自適應(yīng)特性，可以；在創(chuàng)建樣式文件時(shí)，可以使用以下CSS代碼來實(shí)現(xiàn)圖片的自適應(yīng)功能backgroundimage url#39圖片路徑#39backgroundsize coverbackgroundposition center這些規(guī)則將確保圖片根據(jù)容器的大小調(diào)整其顯示比例，同時(shí)保持圖片的中心對(duì)齊完成代碼編寫后，返回到HTML文件所在的文件夾，雙擊HTML文件以打開它。

1新建一個(gè)HTML文件，代碼如下圖 2打開HTML文件所在的文件夾，雙擊文件，跳轉(zhuǎn)到瀏覽器 3改變?yōu)g覽器大小，發(fā)現(xiàn)圖片沒有變化，顯示不全 4在所在文件夾下，新建一個(gè)樣式文件，命名為 autocss，代碼如下 5在HTML文件中加上對(duì)樣式文件的引用，返回文件夾，雙擊HTML文件，發(fā)現(xiàn)瀏覽器的變化會(huì)引著。

自適應(yīng)網(wǎng)站是一種網(wǎng)頁設(shè)計(jì)技術(shù)，它能根據(jù)設(shè)備屏幕的大小和寬度自動(dòng)調(diào)整布局，適應(yīng)在不同終端設(shè)備上的顯示這種設(shè)計(jì)被稱為響應(yīng)式，是一種HTML5的新技術(shù)自適應(yīng)網(wǎng)站具有以下優(yōu)勢(shì)1它使用一套代碼來支持PC端手機(jī)端和IPAD端，無需額外的代碼2只需要一個(gè)后臺(tái)賬號(hào)管理，簡(jiǎn)化了管理流程3避免了；方法一使用background屬性創(chuàng)建HTML文件新建一個(gè)HTML文件，并添加基本的HTML結(jié)構(gòu)添加CSS樣式在HTML文件中或通過外部CSS文件，為包含圖片的容器設(shè)置樣式使用backgroundimage屬性設(shè)置圖片使用backgroundsize cover確保圖片覆蓋整個(gè)容器，并根據(jù)容器大小自適應(yīng)可以設(shè)置width 100%和height auto使。

coords 中的值只能是數(shù)字，你的問題可以用 JavaScript 來解決 頁面加載的時(shí)候，用 JavaScript 獲取圖片的尺寸，例如 500 * 300，當(dāng)圖片尺寸發(fā)生改變的時(shí)候再獲取一次，例如 400 * 240，獲取比例，400 500 = 08然后使用 JavaScript 重新設(shè)定 coords 284 * 08 419 * 08 46 * 08；一使用textarea標(biāo)簽進(jìn)行多行文本的輸入有很多限制，比如不能實(shí)現(xiàn)高度自適應(yīng)，會(huì)出現(xiàn)難看的滾動(dòng)條等問題HTML5中添加了一個(gè)新屬性contenteditable，該屬性可以讓input，textarea以外的不可編輯的標(biāo)簽具備可編輯功能用法如下contenteditable=quottruequot當(dāng)屬性值為true的時(shí)候，可編輯標(biāo)簽內(nèi)可以寫入標(biāo)簽，對(duì)于。

例如，如果有一個(gè)DIV需要顯示較長(zhǎng)的文本或圖片，但你希望限制其高度以適應(yīng)屏幕，你可以設(shè)置一個(gè)固定高度，如200px當(dāng)這個(gè)DIV的內(nèi)容超過200px時(shí)，overflow scroll屬性將自動(dòng)激活，生成縱向滾動(dòng)條，方便用戶滾動(dòng)查看內(nèi)容這種方法不僅能夠保持頁面布局的整潔，還能提升用戶體驗(yàn)值得注意的是，雖然overflow；相關(guān)信息 1CS6新增功能 利用Adobe DreamweaverCS6軟件中改善的FTP性能，更高效地傳輸大型文件更新的“實(shí)時(shí)視圖”和“多屏幕預(yù)覽”面板可呈現(xiàn)HTML5代碼，使您能檢查自己的工作2自適應(yīng)網(wǎng)格 可響應(yīng)的自適應(yīng)網(wǎng)格版面，使用響應(yīng)迅速的CSS3自適應(yīng)網(wǎng)格版面，來創(chuàng)建跨平臺(tái)和跨瀏覽器的兼容網(wǎng)頁設(shè)計(jì)利用。

根據(jù)頁面尺寸設(shè)備屏幕尺寸等條件，為不同設(shè)備設(shè)置特定的CSS樣式實(shí)現(xiàn)自適應(yīng)布局例如，為寬度小于480px的頁面設(shè)置特定樣式，以確保內(nèi)容在不同設(shè)備上都能良好展示此外，對(duì)于沒有編程基礎(chǔ)的用戶，可以考慮使用免編程工具來制作自適應(yīng)網(wǎng)站，這些工具通常通過拖拽操作即可生成自適應(yīng)的HTML5頁面。

html5中是通過css3的backgroundsize來控制自適應(yīng)的backgroundsize神奇之處就在于它的自我調(diào)整能力我以前常常擔(dān)心當(dāng)瀏覽器窗口發(fā)生變化，當(dāng)有resize事件發(fā)生時(shí)，頁面會(huì)出現(xiàn)不可預(yù)測(cè)的變化但backgroundsize卻能根據(jù)客戶端瀏覽器的大小自我的調(diào)整適應(yīng)backgroundsize在火狐瀏覽器， Safari瀏覽器；html5中是通過css3的backgroundsize來控制自適應(yīng)的直接在圖片代碼里面設(shè)置style，例如ltimg src=quotxxxjpgquot style=quotmaxwidth100%quot2要么給圖片統(tǒng)一一個(gè)class名例如responseimg，然后在css文件里面設(shè)置這個(gè)class html5 萬維網(wǎng)的核心語言標(biāo)準(zhǔn)通用標(biāo)記語言下的一個(gè)應(yīng)用超文本標(biāo)記語言HTML的。

一自適應(yīng)網(wǎng)站的特點(diǎn) 自適應(yīng)顯示網(wǎng)頁能夠根據(jù)不同終端設(shè)備的屏幕大小自動(dòng)調(diào)整布局，確保在不同設(shè)備上都能獲得良好的瀏覽體驗(yàn)一套代碼滿足多終端通過HTML5等技術(shù)的革新，自適應(yīng)網(wǎng)站使用一套代碼即可滿足PC端手機(jī)端和IPAD端等不同設(shè)備的瀏覽需求簡(jiǎn)化管理流程無需為不同設(shè)備分別維護(hù)多個(gè)版本的。