發表時間: 2021-11-17 11:03:23
作者: 萬站網
瀏覽:
隨著時代的進步,電腦屏幕尺寸和分辨率也不斷變大,屏幕尺寸從最早期的10寸、12寸、13寸、14寸、15寸、17寸到現在的19寸、21.5寸、22寸、24、27寸……分辨率也從早期的800*600 、1024*768 、1152*864到現在的1280 *1024、1440x900 、1600x900 、1680x1050、1920x1080,所以網站建設也要跟隨不同時代的主流電腦尺寸設計不同寬度的網站頁面。
早期網站一般設計頁面寬度是780、850、900,現在的網站設計主流寬度一般是990、1002、1200.
為什么不設計更寬的呢?也有些不懂的客戶提出更寬的頁面設計要求,其實這樣是不對的,因為網站做出來不只是給自己看的,最主要的還是給訪問網站的潛在客戶看的,不同客戶的電腦屏幕尺寸和分辨率都不同,如果設計頁面太大,那么一些有些小屏幕看起來就會很吃力,因為網站右邊會有一部分內容顯示不出來,需要靠拉動左右滾動條來查看網頁內容,如果設計網站的頁面寬度太窄,那么大屏幕訪客看到的網頁兩邊就會出現大量的空白地帶,所以設計網站不能太寬也不能太窄,選擇中間主流寬度990-1200為佳,這種寬度在15-17寸屏幕看起來剛剛好,是全屏顯示,不用拉動左右滾動條,15寸以下的屏幕就不用考慮了,因為現在基本已經淘汰,很少有人用了,19寸以上(分辨率1600x900以下)的兩邊有一點留白,看起來也很自然,分辨率1600x900以上的,看起來可能留白會比較多,一般這種高分辨率的客戶都會通過調整瀏覽器的縮放比例來達到最佳視覺效果,當然也有一部分大屏幕訪客不會調整瀏覽器的縮放比例,針對這部分客戶網站建設者就設計出一種看起來類似全屏顯示的效果方案,下面我們就講講針對“已經設計固定寬度的PHP網站”怎樣實現全屏通欄效果?
首先,登陸網站后臺-進入排版模式-頁面背景和布局:
1、上傳背景圖片
2、選擇“頂部背景”——選擇要顯示的效果圖片——背景定位“左上”——水平重復——滾動——其他默認
3、選擇“網頁背景”——選擇要顯示的效果圖片——背景定位“左上”——水平重復——滾動——其他默認
保存退出,就可以看到效果了。
比如我上傳圖片是一張30*40的黑色圖片(如下圖)
按照以上方法操作后,網站抬頭顯示效果如下:
比如我上傳圖片是一張60*218的“白+藍”圖片(如下圖)
按照以上方法操作后,網站抬頭顯示效果如下:
比如我上傳圖片是一張70*262的“黑+白+藍”圖片(如下圖)
按照以上方法操作后,網站抬頭顯示效果如下:
你也可以發揮自己的想象力,上傳更大更漂亮的特效圖片,不止限制于上面哦……
比如:
這樣的效果你也能做到的。