大學還沒畢業就匆來了家軟體公司，一開始就叫我做前端，一開始我是拒絕的，心想我學的是做php後臺的，前端會一點就可以了。不過後來聽了幾經理的開導以及幾位

老程式設計師的細心講解，我感覺做好前端也是成為一個好的程式設計師的必修課。

   一開始只會簡單的div+ css佈局，切圖也是花了一個小時 的時間學習的，做到後面感覺問題也越來越多，特別是要相容ie6瀏覽器的問題。以前寫程式碼，寫到哪算到那，只要瀏覽器不出現明顯的錯亂就可以。可是這次剛剛寫好的頁面一放到ie6中什麼都亂了。這下才意識到相容的重要性。於是一行一行程式碼的修改。

  幾天的前端做完以後，發現了不少的問題，也總結了許多經驗，下面就和大家分享一下。首先是切圖，網頁設計師給的都是psd檔案，這裡ps有個快捷鍵按住ctrl+alt 然後用滑鼠右鍵你想要隱藏的內容這樣會在左側的圖層裡看見相應的圖層，點一下眼睛就能隱藏。切圖要完全按照圖片的尺寸大小，按住alt鍵滑動滑鼠能放大縮小。切好圖按住ctrl+shift+alt

+s儲存切好的圖片。

  圖片切好了，接下來就是佈局了，首先要規劃好網頁的內容，什麼該用什麼要想好，有的公共的可以抽取出來。網頁中用的最多的就是float浮動，可以用來做一些標籤的定位。

首先設定和一個100%的div，在100%的div裡面設定一個固定長度的div，固定長度div設定居中margin:0 auto；這樣在怎麼佈局頁面都不會亂。還有一些注意事項，行內標籤裡最好不要巢狀其他標籤，可能會造成頁面的紊亂，比如span，img等行內標籤給其加一個display：block；可以使其變成塊狀標籤，可以控制其寬高。再有就是一些標籤的選擇，

帶有圖片加文字的列表可以使用dl dt ，純文字的可以使用ul li，等。

在做到ie6相容時，遇到一個問題就是透明背景，background:rgba(255,255,255,0.7);這個屬性在其他瀏覽器可以，在ie9以下就不行了，所以這裡我採用了ie中的濾鏡來做

filter: progid:DXImageTransform.Microsoft.gradient(startcolorstr=#9FFFFFFF,endcolorstr=#9FFFFFFF);這樣在ie下亦可以顯示透明背景。還有就是解決png-24格式的透明背景圖片在ie6中背景為灰的情況，這裡要判斷以下瀏覽器，載入一段js，<!--[if IE 6]><script type="text/javascript" src="js/DD_belatedPNG.js"></script><![endif]-->

  還有一個特別好用的東西，不知道大家有沒有遇到過這樣的問題，按鈕的圓角或者div’的圓角，大家一定想起來一個屬性border-radius，的確這個屬效能實現圓角，可是如果是ie瀏覽器，這個屬性就沒什麼用了，下面教給大家一個好的方法。在你的css檔案裡面載入一個iecss3.htc檔案，語法behavior: url(css/iecss3.htc);記住在哪個標籤用就加到那個上面，在把那個檔案放到css目錄下。這樣你使用border-radius在ie下也可以使用了。

 今天就說到這吧，以後遇到問題還會來分享的