<br>

<font size="+6">大字</font>
<font size="-1">小字</font>

<b>變粗的文字1</b>
<strong>變粗的文字2</strong>
<span style="font-weight:bold;">變粗的文字3</span>

<i>斜體1</i>
<em>斜體2</em>
<span style="font-style:italic;">斜體3</span>

<style type="text/css">
<!--
h1{
  //標題用的文字區塊
  }
p{
  //文字的第一行內縮
  text-indent: 50px;
  //字間距離
  letter-spacing: 3px;
  //行間高度
  line-height: 0.8;
  //文字居中
  text-align:center;
  }
b{
  //粗字。手機版不太起作用
  }
strong{
  //粗字。比較對應手機版
  }
span{
  //讓文字成為區塊元件
  display:inline-block;
  //文字背景
  background:#000000;
  background:rgba(0,0,0,1.00);
  //文字顏色
  background:#ffffff;
  color:rgba(255,255,255,1.00);
  //區塊圓角
  border-radius:13px;
  -moz-border-radius:13px;
  -webkit-border-radius:13px;
  //粗字。也可以這樣設定。對應中文。英文有更多詳細設定。
  font-weight:bolder;
  }
a{
  //讓a成為母區塊
  position:relative;
  }
a:hover{
  //不要出現文字下底線
  text-decoration:none;
  }
a:hover::before{
  //讓a:hover::before成為子區塊
  position:absolute;
  }
-->
</style>

<style type="text/css">
table{
   border:#000000 solid 1px;
   border-collapse:collapse;
}
table tr, table td{
  border:#000000 solid 1px;
  }
</style>

img {
  filter: gray; /* IE6-9 */
  filter: grayscale(1); /* Firefox 35+ */
  -webkit-filter: grayscale(1); /* Google Chrome, Safari 6+ & Opera 15+ */
}

/* Disable grayscale on hover */
img:hover {
  filter: none;
  -webkit-filter: grayscale(0);
}

  border: 10px solid blue; /*border 加寬並不會改變寬度*/
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;

<!--按下two連結-->
<a href="#two">go two</a>
<!--這裡必須預留比瀏覽器高的空間-->
<!--會捲至two的位置-->
<h1 id="two">