早上呆頭了下．．．怎麼加入圖片連結那個連結線弄不掉
圖片連結有框沒框對照
還以為加了下面幾行css會奏效
<!--
a:link {
text-decoration: none;
}
a:visited {
text-decoration: none;
}
a:active {
text-decoration: none;
}
-->
結果也是失敗(指IE7.0，沒試其它瀏覽器)
其實要弄掉很簡單，img標籤設border屬性為0就行了，冏
<img src="pic.jpg" border="0">
以我為中心的宇宙 發表在
痞客邦
留言(0)
人氣()
html, body { margin: 0; text-align: center; }
#container {
position: relative;
margin: 0 auto;
width: 760px;
text-align: left;
}或者是用負邊界置中的trick
#wrap {
width: 容器寬度;
position: relative;
left: 50%;
margin-left: -容器寬度/2}html, body { margin: 0; }
#container {
width: 780px;
position: relative;
left: 50%;
margin-left: -390px;
}
如果在IE沒正常顯示時，先檢查一下DOCTYPE這個標籤有沒有正常設定
以我為中心的宇宙 發表在
痞客邦
留言(0)
人氣()
在寫文章時如果有程式碼的部份，想用縮排來幫助閱讀，通常會用<pre>，可是它的缺點就是會自動跳行，而且在上下段出現太多空白，如下：
HTML:
<pre>
第一行第一行第一行
第二行第二行第二行
第三行第三行第三行
</pre>
瀏覽器呈現的結果：
第一行第一行第一行
第二行第二行第二行
第三行第三行第三行
於是在code的CSS裡加上了 white-space:pre;
不僅可以達到排版的效果，也沒了討人厭的空白了~~
2008-04-28 修改但是使用<pre>的缺點就是，就算原來文章縮排好了，如果使用者複製程式碼為己用時，
也會出現全部內容又縮在一行的現象，因此如果是顧慮這層面，就只好乖乖加上 (空白)了...
以我為中心的宇宙 發表在
痞客邦
留言(0)
人氣()
幫blogger加上了一個新功能，讓文章內文有程式碼時具有背景，以增進閱讀，順便復習一下 CSS 的 tag、Class、ID 易混淆的用法...
<code> : 設定 code tag，這個主要是用來寫部落格文章時，對程式碼加上背景增進閱讀CSS:
code {
display: block; /* fixes a strange ie margin bug */
font-family: Courier New;
font-size: 9pt;
overflow: auto;
background: #ccc url(http://chiulin.wei.googlepages.com/Code_BG.gif) left top repeat-y;
border: 1px solid #ccc;
padding: 10px 10px 10px 21px;
max-height: 200px;
line-height: 1.2em;
letter-spacing: 0px;
color: #000;
width: 90%;
}
HTML:<code> 程式碼內容 程式碼內容 程式碼內容 </code>
<code.cmd> : 除了<code>的一般性使用，如果想將command下的程式指令用不同背景，加了下面的 CSS ，讓文章撰寫時更多元呈現~CSS:
code.cmd {
font-size: 10pt;
color: #ccc;
background: #000 url(http://chiulin.wei.googlepages.com/BG_CMD.gif) left top repeat-y;
}
HTML:
<code class="cmd"> 程式碼內容 程式碼內容 程式碼內容 </code>
巢狀CSS，specify properties to selectors within other selectors:CSS:
#top {
background-color: #ccc;
padding: 1em
}
#top h1 {
color: #ff0;
}
#top p {
color: red;
font-weight: bold;
}
HTML:
<div id="
top">
<
h1> Chocolate curry </
h1>
<
p> This is my Test </
p>
<
p> Mmm mm mmmmm </
p>
</div>
資料來源:HTML dog
以我為中心的宇宙 發表在
痞客邦
留言(0)
人氣()
以我為中心的宇宙 發表在
痞客邦
留言(0)
人氣()
