控制分頁列印

我會在第一頁
<p style="page-break-after:always">第一頁</p>
我會在第二頁
<p style="page-break-after:always">第二頁</p>
試著用預覽列印來看就知道結果
我會在第一頁

第一頁

我會在第二頁

第二頁

在文章裡顯示優質的程式碼

出處: 良人的大秘寶

1. 在CSS中加入 (</head>之前)
CODE {
display: block; /* fixes a strange ie margin bug */
font-family: Courier New;
font-size: 8pt;
overflow:auto;
background: #f0f0f0 url(http://klcintw.images.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;
}

2. 使用方法: 在文章中將程式碼置於<code>及</code>的區塊中即可

3. 注意事項: 有些符號必須先轉換

固定網頁背景不隨捲軸動

body {
background: url("http://背景圖位址") ;
background-attachment: fixed;
}

利用CSS控制打印

<style>
@media print{
INPUT {display:none}
}
</style>
<TABLE border="0" style="font-size:9pt;" width="300px" align="center">
<THEAD style="display:table-header-group;font-weight:bold">
<TR><TD colspan="2" align="center" style="font-weight:bold;border:3px double red">每页都有的表头</TD></TR>
</THEAD>
<TBODY style="text-align:center"">
<TR><TD>表格内容</TD><TD>表格内容</TD></TR>
<TR><TD>表格内容</TD><TD>表格内容</TD></TR>
<TR><TD>表格内容</TD><TD>表格内容</TD></TR>
<TR><TD>表格内容</TD><TD>表格内容</TD></TR>
<TR><TD>表格内容</TD><TD>表格内容</TD></TR>
<TR><TD>表格内容</TD><TD>表格内容</TD></TR>
<TR style="page-break-after:always;"><TD>表格内容</TD><TD>表格内容</TD></TR>
<TR><TD>表格内容</TD><TD>表格内容</TD></TR>
<TR><TD>表格内容</TD><TD>表格内容</TD></TR>
<TR><TD>表格内容</TD><TD>表格内容</TD></TR>
<TR><TD>表格内容</TD><TD>表格内容</TD></TR>
<TR><TD>表格内容</TD><TD>表格内容</TD></TR>
<TR><TD>表格内容</TD><TD>表格内容</TD></TR>
<TR style="page-break-after:always;"><TD>表格内容</TD><TD>表格内容</TD></TR>
<TR><TD>表格内容</TD><TD>表格内容</TD></TR>
<TR><TD>表格内容</TD><TD>表格内容</TD></TR>
<TR><TD>表格内容</TD><TD>表格内容</TD></TR>
<TR><TD>表格内容</TD><TD>表格内容</TD></TR>
<TR><TD>表格内容</TD><TD>表格内容</TD></TR>
<TR><TD>表格内容</TD><TD>表格内容</TD></TR>
<TR style="page-break-after:always;"><TD>表格内容</TD><TD>表格内容</TD></TR>
</TBODY>
<TFOOT style="display:table-footer-group;font-weight:bold">
<TR>
<TD colspan="2" align="center" style="font-weight:bold;border:3px double blue">每页都有的表尾</TD>
</TR>
</TFOOT>
</TABLE>
<input type=button value=" 打 印 " onclick="window.print()">

中文直排顯示


<DIV style="DIRECTION: ltr; WRITING-MODE: tb-rl; HEIGHT: 400px">
文字
</DIV>
新細明體

<DIV style='writing-mode:tb-rl; font-family: "新細明體"'>
直排的字
</DIV>

半透明的層

1) 要先定義一個 CSS 的樣式

<style type="text/css">
     .halfalpha {
            background-color:#000000;
            filter: Alpha(Opacity:50);
      }
</style>

2) 應用在層的標籤裡

<div class="halfalpha">