作者TKirby ( ^-^)
看板Web_Design
標題Re: [問題] 霓虹發光字?
時間Wed Mar 2 14:30:42 2005
基本上標準的 CSS2 作得到你要的效果,利用 text-shadow 屬性
不過這個屬性已經在 revision(CSS2.1) 中被刪除了
看來是移到 CSS3 中了,
見
http://www.w3.org/TR/2003/CR-css3-text-20030514/#text-shadows
這一頁下面的 Example 有範例,可以看到大概會長什麼樣子
基本上跟舊的 CSS2 的範例一樣。
我試過, Firefox 無效,不過就算 Firefox 可以 IE 大概也不可以
另外使用 pseudo class 插入 content 的方式大概也不行,
因為你要求的是不定的文字
再來就是用 javascript 了,
如果你在一個無法自己任意變更網頁原始碼的地方想用 js 做這件事
就要看這個網站讓不讓你放 js囉。不給放的話,看看能不能放 iframe
也許還有機會。最後的法子就是用 IE 的 behavior,
但是這個非 IE 的瀏覽器不能看(也不是標準) 所以大概不考慮
那麼只剩下用圖片了。其實這是一個好方法
找個可以放 cgi 的網頁寫一個簡單的 cgi ,
輸入什麼字串就輸出這個字串的霓虹圖
然後放字的地方就用這個 cgi加輸入的網址替代
當然,這也要你想放字的地方可以插圖才行。
假如你只能用 css 來改變文字的長相,那你只好等個大概五到十年
所有的瀏覽器都支援了 css3 或者舊的 css2 之後再說吧... XD
何況現在 css3 還在 "under construction" 呢...
如果是在可以放 js 的地方,用 js 則是可行的
目前也只有這個方法比較方便, source 也不會雜亂
在主要支援 js 的瀏覽器上也才都能看到你的效果
不過一關掉 js 就看不到啦~
※ 引述《bias (bias)》之銘言:
: : 推 ificould:做成圖片吧? 小圖的檔案大小應該還好...
: 感謝大大回應,但我不是這個意思。
: 原本我是想在 blog 的 blogbody、comment-body、comment-post
: 等處使用發光外框字體。但若單純在 CSS 中寫入 comment-body
: {filter: glow(#00FF00) color: #FFFFFF, padding: 1px;} 之
: 類的設定,在 IE 核心底下的瀏覽器閱讀網頁當然可以得到想要
: 的效果,然而若換到 FireFox,就只看得到白色字體了。甚至還
: 會造成各篇留言回應全部重疊在同一排的混亂情形。所以這不是
: 作成圖片可以解決的問題,我不是要把這種效果用在那種地方。
: ※ 引述《capitalM (that I've never had)》之銘言:
: : 搜尋到一個方法,不過十分複雜
: : http://www.yabbforum.com/community/
: : YaBB.pl?board=test;action=display;num=1095919377
: : 推 sandpaper:我有想過耶....汗||..這樣我寧願用普通字= =
: : 推 ificould:還是用普通字吧..
: : → TKirby:可以用 js 產生,這樣會比較輕鬆
: 我努力研究這段語法才瞭解到,原來這是把相同的字換上不同顏
: 色重疊在一起,但稍微作點位移,終於造成跟{filter: glow}類
: 似的的外框字體視覺效果。
: 但這仍然只能用在確定文字內容是什麼的情形之中,譬如說我可
: 以把整篇文章照這種方法反覆重疊並微調各 span 的位置,換到
: FireFox 上瀏覽便可以得到整篇文章都有外框字的效果。
: 但重點不在用這種方式貼文是自找麻煩,而是仍然無法將此技術
: 運用在文章的 blogbody 的 title、date、post 等由系統控制
: 生成的部分,當然也無法運用在無法控制的 comment 部分。
: 也許是可以用 JavaScript 技術解決,但一來我自己還沒學過相
: 關技術,二來目前無名小站並不打算開放對 <script></script>
: 標籤功能的支援。所以我還蠻好奇,那如果寫好 JavaScript,
: 就可以運用到樂多日誌、新浪部落或國外的 blogspot 等免費
: blog 上頭了嗎?
: 也是要用這種重疊好幾層的原理來生成 Script 才能在 FireFox
: 上順利瀏覽嗎?這樣網頁原始檔會不會變又雜亂又龐大?
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 140.112.30.52
※ 編輯: TKirby 來自: 140.112.30.52 (03/02 14:34)
1F:推 bias:謝謝! 218.166.81.136 03/05