第頁網(wǎng)頁設計怎么讓圖片居中一、水平居中(text-align：center;)

這個屬性在沒有浮動的狀況下，我們可以將塊級元素轉(zhuǎn)換為inline/inline-block，然后其父元素加上text-align:center;屬性就可以將其居中。如果是行內(nèi)元素(比如span、img、a等)直接在父元素上添加text-align:center;屬性即可。

二、使用margin:0auto;水平居中

前提：給元素設定了寬度和具有display：block;的塊級元素。

讓一個DIV水平居中，只要設置了DIV的寬度，然后使用margin：0auto，css自動算出左右邊距，使得DIV居中。

三、定位實現(xiàn)居中(必須計算偏移值)

原理:通過定位使元素左上角居中，再通過偏移值margin調(diào)整使元素中心居中。缺點：高度寬度必須事先知道。

.absolute_p1{

position:relative;

width:200px;

height:200px;}

.absolute_p1.absolute_c1{

width:100px;

height:100px;

position:absolute;/*fixed同理*/

left:50%;top:50%;

margin-left:-50px;

margin-top:-50px;/*必須依據(jù)寬高計算偏移量*/}

該方法普遍使用，但是前提必須知道元素的寬度和高度。如果當頁面的寬高是動態(tài)的，比方說頁面必須要彈出一個DIV層必須要居中顯示，DIV的內(nèi)容是動態(tài)的，所以寬高也是動態(tài)的，這是可以用jquery解決居中。

四、jquery實現(xiàn)水平和垂直居中。

jquery實現(xiàn)水平和垂直劇中的原理是通過jquery設置div的css，獲取div的左，上的邊距偏移量，邊距偏移量的算法就是用頁面窗口的寬度減去該div的寬度，得到的值再除以2即左偏移量，右偏移量算法相同。

2網(wǎng)頁制定中圖片的運用

運用超大背景圖

首先要談論的趨勢也就是最流行的趨勢，下面就是一系列運用背景大圖的網(wǎng)站。雖然這個方法已經(jīng)差不多被用爛了，但是我們必須得承認它真的很有效。就像所有的好的制定趨勢都應該發(fā)揚。

如果你的網(wǎng)站是為了展示，那么高清的背景大圖就是一個很強的傳遞信息的方法。但是為了避免過于雜亂，你還是必須要合計清楚文字和標題的位置。

把背景圖作為首頁內(nèi)容

超大型背景照片是當制定師巧妙地使用照片，把它同時作為背景的首頁元素。在這些制定中，把產(chǎn)品放在首頁最前的位置，下滑就可以看到產(chǎn)品的細節(jié)或者配件。通常這是使用產(chǎn)品或前景元素作為焦點來實現(xiàn)的。這種混合使得照片營造了一種時尚感，而內(nèi)容又非常有價值。這一具有挑戰(zhàn)性的方法與你的攝影師好好規(guī)劃協(xié)調(diào)，得到的最終布局一定非常吸引人。

使用單色照片

如果你想要你的照片可以適應不同的風格，無妨使用PS來美化。而如果照片顏色很豐富甚至到了雜亂的地步，在某些狀況下就不應該是你背景圖的最好的選擇。為了解決這個問題，制定師已經(jīng)開始使用單色調(diào)的圖片來表達所想要傳遞的想法和情感。比如，在網(wǎng)頁制定中藍色是常常被運用到的顏色，給人安全和穩(wěn)定的感覺;而紅色顯得充滿活力，朝氣蓬勃。你應當依據(jù)你的產(chǎn)品或者網(wǎng)頁界面風格來選擇你的背景圖的色調(diào)。

使用靜音圖片

靜音圖片的使用會讓人們打開你網(wǎng)頁的第一時間就感覺很舒適，也是最近非常流行的一種風格。大部分的靜音圖片都運用了漸變和顏色淡化的效果，也有復古的風格。而文字也是在圖片的頂部，和圖片風格非常協(xié)調(diào)。這種風格常常在一些攝影師的個人網(wǎng)站上面運用，自從去年開始就變得非常流行了。與這些靜音圖片相配合的都是一些裝飾性字體，這樣就起到了很好的頁面平衡作用。

注重圖片的意義和內(nèi)涵

如果你巧妙的使用那些注重氛圍和內(nèi)涵的圖片，曾經(jīng)激烈的顏色會變得柔軟，反而會對你的內(nèi)容起著畫龍點睛的作用。就像下列圖的個人網(wǎng)站使用太空圖做背景一樣，雖然乍眼看去圖片和個人一點關系都沒有，但仔細想想其實都很有意義，反而顯得更有思想和韻味。當然對待一種風格都要用推陳出新的眼光來看待，畢竟沒有一種風格適用于所有的制定。

垂直分布風格

垂直分布是對齊對象成平行或90度角，以創(chuàng)建組織感的過程。這種方法是比較邊緣和獨特的風格，制定師很少使用。再次，風格往往與制定的時髦風格有關，但它不只于此。這些照片反映超出照片本身的內(nèi)容的含義。他們暗示這些照片背后的特質(zhì)，他們建議規(guī)程，流程和組織意識。這些都是很好的特質(zhì)，尤其是當它用于展示代表制定師和機構(gòu)的時候。

3網(wǎng)頁制定課程大綱

第一節(jié)：banner圖文排版

主要內(nèi)容：嘗試用同樣的素材和文字，進行多種不同的排版學習

第二節(jié)：場景類banner合成

主要內(nèi)容：簡單場景合成，分析在合成中必須要注意的問題

第三節(jié)：品牌類網(wǎng)站講解

主要內(nèi)容：通過實例進行品牌類網(wǎng)站的講解，同時分享自己總結(jié)的一些排版方面的經(jīng)驗技巧

第四節(jié)：互動類型網(wǎng)站講解

主要內(nèi)容：通過實例進行互動類網(wǎng)站的講解，將文案導航等信息與場景進行相應結(jié)合

第五節(jié)：活動專題類型網(wǎng)站講解

主要內(nèi)容：通過實例進行活動專題類型網(wǎng)站講解，如何把握好活動專題的氛圍打造

第六節(jié)：游戲類型網(wǎng)站素材修整

主要內(nèi)容：通過實例演示如何修整必須求方提供的各類素材

第七節(jié)：游戲類型網(wǎng)站各種風格標題效果打造

主要內(nèi)容：主要針對萌系、硬朗、書法等不同風格的標題進行效果的打造

第八節(jié)：常規(guī)游戲類型網(wǎng)站講解

主要內(nèi)容：通過實例進行常規(guī)游戲類網(wǎng)站的講解，主要分享人物、場景的融合及內(nèi)容的擺放

第九節(jié)：多人物疊加如何做出層次感

主要內(nèi)容：通過實際的游戲案例講解，主要分享再有多人物疊加的狀況下，如何拉開各個人物之間的層次感和空間感

第十節(jié)：水墨風游戲類型網(wǎng)站講解

主要內(nèi)容：通過實例進行水墨風格游戲類網(wǎng)站的講解，主要分享制定水墨風網(wǎng)站時應注意的問題和水墨素材的合理拼接

第十一節(jié)：游戲頁面形式感打造

主要內(nèi)容：通過實例進行不同形式游戲類網(wǎng)站的講解，主要分享打造不同形式時的一些經(jīng)驗和技巧

第十二節(jié)：如何加強頁面代入感

主要內(nèi)容：通過實例進行頁面代入感講解，讓瀏覽者看到頁面的第一眼就能身臨其境。

第十三節(jié)：現(xiàn)場修改部分同學作業(yè)，現(xiàn)場答疑，并傳授相關面試找工作方面的知識。

4如何才干學習好網(wǎng)頁制定

大概咱的要領不是最好的，不過很得當咱。要是開始過多的依賴于軟件，css內(nèi)里的許多樣式必要好久才會記得，用起來天然不會得心應手，等慢慢熟記了手冊里的每個樣式今后，為了提升開拓效率，再用(dreamweaver簡寫，下同)寫。

養(yǎng)成好的謄寫風俗

記得大學時間1個教咱們delphi老師講過，好的步調(diào)員寫出的步調(diào)像詩1樣，長短不1，很有美感。咱想講咱們在寫html與樣式的時間也應該是如此的，好比在寫html的時間，咱的風俗是div標簽成對寫好，再填內(nèi)容。不然很容易落下關閉標簽，出現(xiàn)錯誤很難排查，有人會講了，寫簡略的頁面能，不過寫大的頁面，通常幾十個套在1起，容易寫串，這種環(huán)境也會有，這就要靠適當?shù)闹v明，與縮進來克制了。寫css的時間網(wǎng)上有許多保舉的范例，好比菜單類用menu，版權(quán)用coryright，底部用footer等等，在謄寫序次上1樣平常是：表現(xiàn)屬性-自身屬性-文本屬性。即使這些都沒有硬性的劃定，不過遵照1些不行文的劃定不是壞事，如此讓本身寫的代碼，容易讓別人讀懂。

走出誤區(qū)

誤區(qū)1，web尺度就是全部用div。

許多曩昔用table布局的人，學了div+css今后，你在他的代碼里就再也找不到table了，以為用table是件不色澤的事。真相并非云云，web2.0尺度也沒明確提到用table還是div，因為table也是切合xml規(guī)矩的。含有table的頁面還是能議決xhtml1.0的驗證。再者，div+css大概是萬能的，但在有些方面并不是最好的。好比咱們在做1個表單，table絕對是最好的處理方案，div實現(xiàn)起來絕對沒有table來的輕便。

誤區(qū)2，肯定要議決驗證。尺度只是促使咱們在感念上的加載不是簡略的代碼的轉(zhuǎn)變。許多人用js誘騙validator，議決驗證，如此沒有通不外驗證的頁面，不過議決驗證并不是咱們的最終目的。咱們想寫出