❶ 求夠圖片上得網站模板,要求是自適應的
在我們設計網頁的時候,經常會遇到圖片自適應問題,實際這些工作完全可以交給瀏覽器來完成就可以了,只可惜,無論是IE還是FIREFOX在圖片自適應這個問題上都處理的不盡人意,網上實現網頁圖片寬度和高度的方法也很多,主要又兩種:
第一種是使用CSS來完成;第二種是使用Javascript來完成,根據實際的應用效果來說,使用Javascript還是比較靠譜一點,因為 CSS的expression的確有點煩,筆者是指使用效果上有點惱人,本文專門把這兩種都總結一下,方便站長們參考使用。
一、使用CSS實現圖片的自適應
使用CSS實現圖片自適應很簡單,主要靠兩個參數來完成,分別是max-width和max-height,這兩個參數在FIREFOX和IE7以上支持都很好,但是在IE6上面,效果非常糟糕,尤其是對於多張圖片的顯示,第一次顯示網頁大都很難達到圖片自適應的效果,一般都是有些能自適應,有些不能自適應,多次刷新可能又顯示OK,就是這點就足夠煩人,而且一旦顯示多張圖片,IE 6上就卡的要命(expression在IE上比較佔用資源,感覺設計是用來玩得,FIREFOX自適應效果還是比較好,速度也非常快),反正筆者至今是沒有找到更好的CSS方法來讓IE 6完美支持圖片自適應。示例代碼如下:
img{
max-width: 128px;
max-height: 128px;
height:auto;
zoom:expression( function(e) {
if(e.width>e.height) {if (e.width>128) { e.height = e.height*(128 /e.width); e.width=128; }}
else {if (e.height>128) { e.width = e.width*(128 /e.height); e.height=128; }}
e.style.zoom = '1'; }(this));
overflow:hidden;
}
上面代碼格式上需要特別注意兩點:
1、zoom屬性里寬高賦值不能帶單位(如px),否則無效;
2、if和else語句也必須帶大括弧括起來,單句指令也不行(而在很多編程語言里,單句指令可以無需大括弧);
二、使用Javascript實現的圖片自適應
使用Javascript自適應相對來說比較方便,唯一的麻煩是就是在網頁中需要對image預設置onload事件處理resize()函數,如果對於動態網頁來說還好一點,反正是動態的,程序里加上去就OK了,可是如果對於很多篇文章而言,在里頭增加onload函數有點麻煩,除非一次性的寫個腳本批量處理,否則後期更改或替換起來還是比較麻煩,比如圖片的可顯示寬度變化等等。
另一方面如果把寬度值寫在Javascript中,那麼將帶來程序的通用性降低,下面的示例不是寫死的,已測試效果比起CSS要HAPPY的多,網上也又很多類似的例子,不是不完成就是中間還存在某些問題,本文的例子應該會更好一點,筆者對不同的尺寸下的圖片的顯示效果做過好幾種測試了。示例如下:
//RESIZE 圖片自適應圖片寬度和高度
//參數說明:
// obj是圖片對象,this調用方法見下面示例
// maxW和maxH分別為約定的最大寬度和最大高度
function resizeimg(obj,maxW,maxH)
{
var imgW=obj.width;
var imgH=obj.height;
if(imgW>maxW||imgH>maxH)
{
var ratioA=imgW/maxW;
var ratioB=imgH/maxH;
if(ratioA>ratioB)
{
imgW=maxW;
imgH=maxW*(imgH/imgW);
}
else
{
imgH=maxH;
imgW=maxH*(imgW/imgH);
}
obj.width=imgW;
obj.height=imgH;
}
}
上例的使用示例:<img src="/www.metsky.com/logo.gif" onload="resizeimg(this,600,1024);"/>
我們在制定寬度和高度值的時候,一般寬度是肯定需要限定,而高度經常不需要限制,所以可以把高度指定的大一點,如果高度也限制,那麼相當於制定一個 image box,下面的程序或許對您很有用(不限制圖片高度的忽略下面這個示例)。
當指定圖片BOX的時候,一般都還需要在圖片自適應之後顯示在BOX容器的中間,也就是水平和垂直都需要居中。首先需要指定BOX容器的寬度和高度,然後可以使用CSS來控制顯示效果,也可以使用Javascript控制顯示效果。示例如下:
IMAGE BOX容器:
<div id="imgbox" style="width:800px;height:800px;border:1px solid #CCCCCC">
<img src="..." onload="resizeimg(this,600,600)"/>
</div>
CSS顯示方法如下:
#imgbox {text-align:center;vertical-align:middle;}
#imgbox img {vertical-align:middle;}
或使用Javascript完成:
在上文resizeimg()函數里最後只需要增加類似這樣的語句,
obj.style.margin-left=(800-imgW)/2;
obj.style.margin-top=(800-imgH)/2;
即可,當然了,您總不能讓resize尺寸本來就超出BOX容器尺寸吧,否則圖片就把容器撐大,style風格肯定就對不上了。
❷ 響應式網站模板免費下載哪兒有
可以在易通cmseasy企業網站模板官網下載到,還有可視化編輯的響應式網站,修改起來很方便。
❸ 大家建議用什麼製作自適應模板
不管是用Dreamweaver還是用notepad++,甚至用記事本都可以製作自適應網站,工具只是輔助。你也可以直接下載自適應網站模板,這樣自帶css、js這些文件,效果也很好。
自適應能夠解決如何才能在不同大小的設備上呈現同樣的網頁的問題,避免工程師無謂的重復編寫代碼的勞動。
❹ wap手機網站模板如何做自適應應該注意哪點
關閉屏幕自動縮放;css註明屏幕像素;分段寫css
❺ 求wordpress自適應的電影類主題
windows主題指的是windows系統的界面風格,包括窗口的色彩、控制項的布局、圖標樣式等內容,通過改變這些視覺內容以達到美化系統界面的目的。在WINDOWS操作系統中,「主題」一詞特指WINDOWS的視覺外觀。電腦主題可以包含風格、桌面壁紙、屏保、滑鼠指針、系統聲音事件、圖標等,除了風格是必須的之外,其他部分都是可選的,風格可以定義的內容是大家在Windows里所能看到的一切。例如窗口的外觀、字體、顏色 按鈕的外觀。 一個電腦主題里風格就決定了大家所看到的Windows的樣子。豐富和滿足人們日益對電腦主題單調性的一種視覺延伸和視覺效應。
❻ 電影網站怎麼做
1、買一個域名,我的域名是06fu.com,現在在騰訊雲阿里雲等網站,十塊錢左右就能買到一個top域名;
2、買一個虛擬空間,我選擇的是美國的空間,某個低價空間,1G的空間和資料庫,花了50塊錢。
3、做好域名和空間之間的解析,然後網路蘋果CMS,下載蘋果CMS V10最新版。上傳到空間並解壓出來;
4、打開你的域名,會自動跳轉到程序安裝界面,設置好資料庫以及你的賬號和密碼,然後登錄後台;
5、找一個自己喜歡的模板,上傳到」template「文件夾裡面,去後台設置」系統-網站參數配置「,設置好網站的標題、域名、關鍵字、logo、模板等信息,最後保存。這里我建議去購買收費的模板,因為我找了第一個模板,白天做好之後晚上再去打開網站,直接就跳轉到別的網站了,後台也登錄不上,這是網站發布者留下的後門,可以修改你的網站。
6、安裝採集插件,將下載好的插件上傳到「
application/admin/view/collect」替換系統自帶的採集插件,或者後台選擇「採集-自定義資源庫-選擇你再網上找好的資源庫,按要求添加即可。實在不想麻煩的朋友可以選擇自帶的採集插件。這里我將提供網路上的蘋果CMS V10採集插件整合版,大家可以關注我,回復「插件」來下載安裝。
7、安裝播放器,這個一定不能省,不然就算你採集了資源也播放不出來。打開「視頻-播放器-點擊導入」將你下載的資源庫TXT文件導入到後台,看一下狀態和解析狀態,一定要選擇「啟用」,選擇系統自帶採集的朋友只需要看一下你採集的資源和相對應的播放器是否啟用即可。
8、採集資源,首先要「綁定分類」就是你希望採集影片放在哪個分類里,就選擇哪個,一定要先綁定分類,不然沒辦法採集資源的。第一次採集要選擇「採集全部」。
9、全部都弄好之後,在「後台管理中心-右上角-選擇清緩存」,打開你的網站看一下吧,已經做好了。
做成這個網站,我一共花費了幾十塊錢,可以說是超低成本了,域名是在阿里雲參與新用戶優惠購買的06fu.com域名,一共花費35元,四拼雜米,感覺自己賺了呢。另外還有一些1塊錢域名,成本真的是太低了。
❼ 移動端應不應該選擇自適應的模板是否對seo有幫助
為啥要選擇用模板呢?建議選擇定製開發,雖然貴了點,但是效益差距不是一個等級的,而且定製開發的網站對SEO也做了更好的優化,我們在做網站優化的時候也簡單了很多
❽ 用dedecms 模板仿站 的時候,對於自適應網站 和一般網站有什麼區別仿站都是一樣的嗎
如名,自適應網站能使網頁自適應顯示在不同大小終端設備上新網頁設計方式及技術。
一般網站則需要自己添加規則,大多都只會添加些主流的PC和WAP設備。
仿站的話可能會復雜許多許多。
❾ HTML5響應式網站模板和自適應網站模板有什麼不同的地方
其達到的效果都一致的,自適應屏幕大小來改變頁面布局適應當前屏幕。
類似爸爸,老爸,爹地,叫法不一樣而已。
❿ html5企業網站,自適應網站模板哪個好
html5企業網站和自適應網站並不是矛盾,只能二者取一的。HTML5是互聯網的下一代標准,是構建以及呈現互聯網內容的一種語言方式,廣泛應用於互聯網應用的開發。而自適應網站模板是讓同一張網頁自動適應不同大小的屏幕,根據屏幕寬度,自動調整網頁內容大小。
兩者沒有說哪個好,一個是編程技術,一個是設計樣式。