以我為中心的宇宙

早上呆頭了下．．．怎麼加入圖片連結那個連結線弄不掉
圖片連結有框沒框對照

還以為加了下面幾行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">

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這個標籤有沒有正常設定

在寫文章時如果有程式碼的部份，想用縮排來幫助閱讀，通常會用<pre>，可是它的缺點就是會自動跳行，而且在上下段出現太多空白，如下：
HTML:
<pre>
 第一行第一行第一行
   第二行第二行第二行
     第三行第三行第三行
</pre>

---

瀏覽器呈現的結果：
第一行第一行第一行
第二行第二行第二行
第三行第三行第三行

---

於是在code的CSS裡加上了 white-space:pre;
不僅可以達到排版的效果，也沒了討人厭的空白了~~
2008-04-28 修改
但是使用<pre>的缺點就是，就算原來文章縮排好了，如果使用者複製程式碼為己用時，
也會出現全部內容又縮在一行的現象，因此如果是顧慮這層面，就只好乖乖加上&nbsp;(空白)了...

幫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

看到開始說class類別用法