Re: [問題] 觀於網頁設計上 圖像與按鈕結合 的一個 …
※ 引述《gene9 (Acting is taking a rest)》之銘言:
: http://0rz.tw/IEIO5
: 像上面那樣的一個圖像
: 在我用紅色框框 框起來的地方都是連結
: 我的問題是,在dreamweaver裡圖像如何與連結按鈕結合在一起?
: 因為我使用下 圖像總是跟按鈕不能疊在一起 只能分開放
: 如果建立圖層 把連結按鈕丟進圖層 再疊到圖像上 是可以做出那樣的效果
: 可是這樣作 圖層不會跟著劉覽器視窗大小自動調整 會定在那邊
: 就會變成 按鈕與圖像對位 會跑來跑去
: 請幫我解解答,感恩阿!
目前想到的作法:
1.Photoshop切版:
先把整個網頁的layout畫成一張圖,用photoshop的切片工具切好,
之後存成html網頁格式。然後進Dreamweaver開啟,設定連結的部份。
如果你連結部份沒有要保留圖片格式,可在PS裡把紅框部份切片後,
進dw把該儲存格內的圖片del掉。接著將儲存格的背景設定為白色,
然後在儲存格內打字設定連結部份。
這個方法因為會存成表格格式,不是很推薦,不過如果你是從視覺
設計入門又不會使用css用這方法比較快。
2.Div+CSS切版:
其實你說的圖層就是用CSS下去設定位置的。
用這方法原始碼看起來比較不會那麼亂,也符合無障礙網頁規範。
不過,用Dreamweaver我不知道要怎麼切,都是從程式碼視窗下去改。
網頁的程式碼會類似以下的格式:
(只列其中一個欄位的局部寫法,此部份我也是初學者,有錯請指正)
<div id="css格式">
<div class="css格式"><img src="圖片位置">火車圖片</div>
<div class="css格式">
<img src="圖片位置">藍色圓點按鈕<a href="網址">彰化新魅力-經典體驗</a>
</div>
</div>
不會css的話,就先略過第2個方法吧XD
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 203.73.66.34
推
03/05 16:38, , 1F
03/05 16:38, 1F
Digital_Art 近期熱門文章
PTT數位生活區 即時熱門文章