MozTW 討論區 • 檢視主題 - [網頁]實做了筆記格線但不甚滿意

所有顯示的時間為 UTC + 8 小時

[網頁]實做了筆記格線但不甚滿意

第 1 頁 (共 1 頁)

[ 7 篇文章 ]

列印模式	上一個主題 \| 下一個主題

發表人

內容

wini

文章主題 : [網頁]實做了筆記格線但不甚滿意

發表於 : 2006-09-11, 23:35

[網站管理員]

註冊時間: 2005-01-02, 05:49
文章: 3220

缺點:
1. 無法調整每行的左右內距
2. 太難用
3. 太難看
4. Opera 上不正常

不知道有沒有人有興趣一起來討論如何製作這種筆記格線的 CSS 的呢？

附加檔案:

檔案註釋: 利用純 CSS 製作出筆記本格線的範例。

last-line-bottom.zip [1.04 KiB]
被下載 524 次

_________________
【Firefox 有問題請先看這裡】
回覆文章的建議
萬用自我檢測除錯大法 for Firefox
完全備份大法 for Firefox
重建 Firefox 的設定
乾淨升級 Firefox
（本帳號停用中）

回頂端

Mozilla/5.0 (Windows; U; Windows NT 5.1; zh-TW; rv:1.8.0.6) Gecko/20060728 Firefox/1.5.0.6

Linuxice

文章主題 :

發表於 : 2006-09-12, 07:16

註冊時間: 2004-12-26, 21:33
文章: 146

看起來滿不錯的呀，使用圖形當底線不知道會不會比較好?圖形也可以自動大小設定的，也比較好看，當然啦，只用css比較簡潔。

_________________
朝自由與免費邁進 http://www.taconet.com.tw/linux0609

Ubuntu 8.04 試用中

回頂端

Mozilla/5.0 (Windows; U; Windows NT 5.0; zh-TW; rv:1.8.0.6) Gecko/20060805 Firefox/1.5.0.6 (pigfoot)

wini

文章主題 :

發表於 : 2006-09-12, 14:09

[網站管理員]

註冊時間: 2005-01-02, 05:49
文章: 3220

Linuxice 寫:

看起來滿不錯的呀，使用圖形當底線不知道會不會比較好?圖形也可以自動大小設定的，也比較好看，當然啦，只用css比較簡潔。

用 hr 式的格線的缺點，就是字數跟大小沒算好的話，就會變成多行配一條格線，所以我才在想用行內元素(inline element)的話，就不怕這情形了。

但是問題就是出在對齊跟最後一行吧……

對齊不用左右對齊不行，各行的左右內距也無法調整。

最後一行因為是行內元素，所以沒辦法讓格線對齊至行末。這點我是在想可以用區塊元素包起來，設個底線跟它對齊應該也可以解決。（應該啦）

總之不太清楚最新的 CSS 技術是怎麼克服這問題的就是了。

當然最簡單的作法就是整個做成一張圖最安定了，連格線的樣式都可以直接處理好。

附加檔案:

檔案註釋: 改用區塊元素底線的作法

last-line-bottom_20060912.zip [1.21 KiB]
被下載 429 次

回頂端

Mozilla/5.0 (Windows; U; Windows NT 5.1; zh-TW; rv:1.8.0.6) Gecko/20060728 Firefox/1.5.0.6

Linuxice

文章主題 :

發表於 : 2006-09-12, 17:21

註冊時間: 2004-12-26, 21:33
文章: 146

wini 寫:

Linuxice 寫:

看起來滿不錯的呀，使用圖形當底線不知道會不會比較好?圖形也可以自動大小設定的，也比較好看，當然啦，只用css比較簡潔。

可是做成圖的話，文字就不能變更大小了，會對不齊。

不知道文字直接加上底線會不會比較好，有點像超連結一樣，線也不會一段一段的。

_________________
朝自由與免費邁進 http://www.taconet.com.tw/linux0609

Ubuntu 8.04 試用中

回頂端

Mozilla/5.0 (Windows; U; Windows NT 5.0; zh-TW; rv:1.8.0.6) Gecko/20060805 Firefox/1.5.0.6 (pigfoot)

wini

文章主題 :

發表於 : 2006-09-12, 19:01

[網站管理員]

註冊時間: 2005-01-02, 05:49
文章: 3220

Linuxice 寫:

可是做成圖的話，文字就不能變更大小了，會對不齊。

不知道文字直接加上底線會不會比較好，有點像超連結一樣，線也不會一段一段的。

不，連同文字一起做成圖片那樣子。比較新的瀏覽器都有縮放圖片的功能，所以不必太擔心倒是。

至於底線，我用起來是失敗的，你可以自行試試。

一段一段的那個叫做 border 的 dashed 效果，絕不是你的瀏覽器有問題。其實改 solid 效果比較看不出來問題在哪就是了……總之用 dashed 會有不一致的問題，我還想不出解決方法。

回頂端

Mozilla/5.0 (Windows; U; Windows NT 5.1; zh-TW; rv:1.8.0.6) Gecko/20060728 Firefox/1.5.0.6

齊藤汪汪

文章主題 :

發表於 : 2006-09-17, 15:14

註冊時間: 2006-04-12, 01:55
文章: 90

要的結果是像這樣嗎??

http://thw1101.googlepages.com/lispan.html

因為我不太會CSS，請勿見怪，重點在清單(ul、li)

(我用IE開，最後一行的虛線不見了...|||)

我是參考這邊變化的：

http://seed100.com/e-learning/w3cn.htm

回頂端

Mozilla/5.0 (Windows; U; Windows NT 5.1; zh-TW; rv:1.8.0.7) Gecko/20060915 Firefox/1.5.0.7 (Firefox musume)

wini

文章主題 :

發表於 : 2006-09-17, 21:27

[網站管理員]

註冊時間: 2005-01-02, 05:49
文章: 3220

齊藤汪汪寫:

不，我要的就是我做出來的那種效果，可惜有難用又難看的 bug 存在就是了。

總之感謝你的回應。 :)

回頂端

Mozilla/5.0 (Windows; U; Windows NT 5.1; zh-TW; rv:1.8.0.7) Gecko/20060909 Firefox/1.5.0.7

第 1 頁 (共 1 頁)

[ 7 篇文章 ]

MozTW » 討論區首頁 » 其它 » 其他中的其他

所有顯示的時間為 UTC + 8 小時

誰在線上

正在瀏覽這個版面的使用者：沒有註冊會員和 8 位訪客

您不能在這個版面發表主題
您不能在這個版面回覆主題
您不能在這個版面編輯您的文章
您不能在這個版面刪除您的文章
您不能在這個版面上傳附加檔案

前往 :