ISU網頁開發平台: 建立不同顏色的最新消息

發佈最新消息的時候若想呈現不同的顏色，或者加上HOT! NEW!等圖樣的時候該怎麼作？請先參考應日系的作法。

1. 作法在發佈最新消息的時候加上<span>的語法。例如

其中 ajnewsimg1 就是用來設定顏色與圖片的icon.做好之後就像下圖的呈現方式。

2. 接著我們要先把檔案上傳到網頁平台的網頁空間位置去，再把圖片設定到CSS的位置。點選「網頁空間」之後上傳圖片。並取得圖片的內部網址。

複製網頁空間中的站內網址，就可以把圖片網址複製下來。

3. 複製完成後請到網站的參數設定 > CSS樣式設定為剛才編輯的最新消息加上標示。請加上以下的語法

.hot_news2_img{
background: url(../upload/84203/icon/new03.gif) no-repeat;
padding-left: 2em;
}

其中 hot_news2_img 就是步驟1裡面設定的class內所包起來的標籤名稱，最新消息可以在此用不同的樣式設定畫面呈現的方式。而剛才複製起來的站內網址就是 url( )括號內所填入的圖片網址。

如果想要為最新消息放上不同的顏色的話，只要把語法加上color的屬性為：

.hot_news2_img{
background: url(../upload/84203/icon/new03.gif) no-repeat;
padding-left: 2em;
color: blue;
}

這樣就可以呈現不同的最新消息顏色。如果要作更多的變化，則可以開啟frongpage或者 dreamweaver等工具尋找CSS的語法就可以再做出更多的變化。

最新消息標題變化參考範例

ISU網頁開發平台