[問題] CSS框線上加字

看板Web_Design作者 (Stargate)時間13年前 (2012/09/25 14:59), 編輯推噓7(709)
留言16則, 8人參與, 最新討論串1/1
請問一下 我想CSS效果做下面這種的框,字蓋在框線上 ╭標題1 ───╮ │... │ ╰──────╯ 有試了border-radius 可是似乎只能做出這種效果,不是我想要的 ╭──────╮ │標題1 │ │... │ ╰──────╯ 不知道要怎麼寫上面的圖框 也不知道要怎麼上google找關鍵字 拜託有人可以給點建議 感謝各位了@@ -- ※ 發信站: 批踢踢實業坊(ptt.cc) ◆ From: 220.132.157.24

09/25 15:14, , 1F
標題1用另外一個div,然後設定一下跟下面那個DIV的相對位置
09/25 15:14, 1F

09/25 15:15, , 2F
把他移到框線上。 我看到這篇直接想的,還沒實際試過
09/25 15:15, 2F

09/25 15:21, , 3F
html的filedset
09/25 15:21, 3F

09/25 15:27, , 4F
margin / position
09/25 15:27, 4F

09/25 15:51, , 5F
感謝各位的建議,原來是fieldset/legend
09/25 15:51, 5F

09/25 15:51, , 6F
我跟3F想的一樣
09/25 15:51, 6F

09/25 16:11, , 7F
一開始想的跟一樓一樣,蓋一個白底絕對位置的DIV文字在
09/25 16:11, 7F

09/25 16:12, , 8F
框線文字上面 DIV 的 TOP 稍微往上一點 沒想到有
09/25 16:12, 8F

09/25 16:13, , 9F
fieldset這個標籤,倒是沒用過,學習了
09/25 16:13, 9F

09/25 17:20, , 10F
用legend最直接;一樓的方法也是可行,標題1的margin-
09/25 17:20, 10F

09/25 17:20, , 11F
top設定成負值(標題1在框裡面的情況)就好了。
09/25 17:20, 11F

09/25 17:22, , 12F
方法不少呢 XD
09/25 17:22, 12F

09/25 17:22, , 13F
這個方法有它的好處,因為legend是屬於不同瀏覽器裡顯
09/25 17:22, 13F

09/25 17:23, , 14F
示出來差異比較大的一個標籤,所以要絕對統一外觀的話
09/25 17:23, 14F

09/25 17:24, , 15F
不要用比較快;但弱點也很明顯:底下有背景圖就破功。
09/25 17:24, 15F

09/25 18:47, , 16F
想到3樓的+1 XD
09/25 18:47, 16F
文章代碼(AID): #1GOLP7jq (Web_Design)