有自動生成這種連結按鈕的軟體嗎?

yamelo

範例網址:
webgo.tw


該站最頂部的連結按鈕
* 新聞    * 日誌    * 圖片    * 商品   * 購物 啊等等...

我分析了它的構造,是用下面這幅背景圖,通過css移position實現的


請問這種 移背景圖position作連結按鈕 大法,有什麼軟體可以做出來?...

瀏覽完整內容，請先 註冊 或 登入會員

kwj

自己寫 CSS 就可以了呀...
您既然能夠分析 CSS，相信就算自己不太會寫
靠 copy-paste 弄出類似的東西應該也不是什麼難事才對...

yamelo

謝謝回答
可以手寫,但人手做不了大量的東西啊...
君不說有了記事本,世界就不要存在其他編程軟體
而且我也不相信那個網是手寫制作的

kwj

可以手寫,但人手做不了大量的東西啊...
君不說有了記事本,世界就不要存在其他編程軟體
而且我也不相信那個網是手寫制作的
yamelo 發表於 2010-8-8 03:57 PM

下載: 訪客無法瀏覽下載點，請先 註冊 或 登入會員

...

瀏覽完整內容，請先 註冊 或 登入會員

vinaqc

你以為軟體可以自動知道哪個按鈕該用哪張圖、該留多少寬高、該給甚麼class name嗎？
不要想太多，沒別的就是手寫

寫程式不是很簡單的一件事
但有時是種樂趣,~~

jcdavidkimo

這個是特別設計的  ,尤期是背景圖
在利用CSS去改變要顯示的座標

首先必須先定義每一個按鈕的長寬

#topmenu a { float: left; width: 48px; height: 56px; text-align: center; text-decoration: none; color: #FFF; padding-top: 39px; height: 17px; overflow: hidden; background: url(topmenu.jpg) no-repeat; }

上面這段CSS  主要是定義 寬為48  高56  超出的部分隱藏
...

瀏覽完整內容，請先 註冊 或 登入會員

jcdavidkimo

這個是特別設計的  ,尤期是背景圖
在利用CSS去改變要顯示的座標

首先必須先定義每一個按鈕的長寬

1. #topmenu a { float: left; width: 48px; height: 56px; text-align: center; text-decoration: none; color: #FFF; padding-top: 39px; height: 17px; overflow: hidden; background: url(topmenu.jpg) no-repea

複製代碼

t; }[/code]

上面這段CSS  主要是定義 寬為48  高56  超出的部分隱藏

1. #topmenu a.news { background-position: 0 0; }

複製代碼

這段為顯示 新聞 的按鈕從圖片座標 x=0 ;y=0

1. #topmenu a.news:hover, #newsmenu a.news { background-position: 0 -56px; }

複製代碼

這段為顯示 滑鼠移動到新聞的按鈕從圖片座標 x=0 ;y=56

其他的依此類推
就以結構來說,他是用一張圖片,來顯示不同的坐標下的圖塊
所以光是圖片就不能用自動生成的方示來產生圖片了
必須要以美工來做
在去計算圖塊的座標...

瀏覽完整內容，請先 註冊 或 登入會員

yamelo

感謝回答,由其是樓上的,很詳細和準確
一開始我就說了它CSS的原理我是懂的,只是想找這類的WYSIWYG工具
所以我知道你用了心去回答,留給別的有需要的人看
還有..原來對岸把這種技術叫作 滑動門

thelord2009

感恩