參考書籍：旗標 網頁程式設計的16堂課 第7-1章節
HTML中表格的框線border=1時，框線是可以看到2層的。不過一般生活中看到的表格，多數只有一層框線。可以使用border-collapse屬性來控制。
當"border-collapse:collapse"時，2層框線重疊成一條線。
當"border-collapse:seperate"時，框線不重疊。
<style>
table {border-collapse:collapse;}
</style>
<table border=1>
<tr>
<td>aaa</td>
<td>bbb</td>
</tr>
<tr>
<td>ccc</td>
<td>ddd</td>
</tr>
</table>
參考網址：MSDN
(目前螢幕約為96DPI)
看 dpi 吧….
96 DPI 時, 1 Inch = 96 Pixels , 1 CM = 1/2.54 Inch = 96/2.54 Pixels = 37.7953 Pixels
列印網頁時瀏覽器會以螢幕的DPI為參考值(非印表機的DPI)
A4:21*29.7cm(標準規格)，實際約為21*29.6
Firefox+Kyocera FS-1040 GX測試
網頁列印時即使邊界都設為0仍會有0.5cm的邊框
所以實際可列印的範圍是(21-0.5*2)*37.8=756Pixels
(29.5-0.5*2)*37.8=1081.08Pixels
… 這跟列印裝置有關。
假設印表機是 600 DPI ，表示 600 pixel = 1 in = 25.4 mm 。
=> 23.6 pixel = 1 mm
參考網址：Linux 技術手札
以下會介紹在 Ubuntu 透過源碼安裝及 apt-get 安裝的步驟:
Ubuntu Repository 安裝:
透過 Ubuntu 預設 Repository 安裝的好處是簡單, 但缺點是安裝的版本會較舊。
$ sudo apt-get install nodejs $ sudo apt-get install npm
PPA Repository 安裝:
如果想安裝較新的版本, 可以透過 PPA Repository 安裝。
先加入 PPA repository:
$ sudo apt-get install python-software-properties $ sudo add-apt-repository -y -r ppa:chris-lea/node.js $ sudo apt-get update $ sudo apt-get install nodejs
Node.js 安裝 Script
使用 Node.js 提供的安裝 Script 安裝是很簡單的方法, 而且可以安裝到最新版本:
$ curl -sL https://deb.nodesource.com/setup_10.x | sudo -E bash –
$ sudo apt-get install nodejs
nodejs -v查看nodejs版本(10.14.2的版本 OK的)
ubuntu16.04預裝版本V4太舊，npm start時會出現npm ERR!scratch-gui@0.1.0 start: `webpack-dev-server` npm ERR! Exit status 1 錯誤
安裝scratch 3.0 https://github.com/LLK/scratch-gui
If you want to edit/play yourself:
git clone https://github.com/LLK/scratch-gui.git cd scratch-gui npm install
Running the project requires Node.js to be installed.
Open a Command Prompt or Terminal in the repository and run:
npm start
Then go to http://localhost:8601/ – the playground outputs the default GUI component
參考網址：臺灣大學計算機及資訊網路中心
-Linux系統(以Ubuntu為例)
1.使用app-get 來安裝，若是CentOS則用yum install
$ sudo apt-get install nodejs
$ sudo apt-get install npm
圖五 NPM安裝
2.Linux上node已被更名為nodejs，可用ln -s 指令來連結node為執行檔
$ sudo ln -s /usr/bin/nodejs /usr/local/bin/node
使用node -v 和npm -v 確認是否已安裝成功。
因為apt-get 安裝比較穩定版本，若要最新版本可自行抓原始碼來編譯。 https://github.com/joyent/node.git
Node.js 教程 http://www.runoob.com/nodejs/nodejs-tutorial.html
參考網址：
校園文化網站課程 提供中文試用版下載點
b24338869
還在測試
cd C:\Program Files (x86)\Corel\Ulead PhotoImpact X3 rename Ulead.dat Ulead.dat_aa mklink /j Ulead.dat D:\soft\Ulead.dat
需用管理者權限執行
本想把Ulead.dat目錄放在x:
可惜 /j 無法使用網路磁碟機
所以還是得把Ulead.dat目錄複製過來
刪除C:\Users\5A88\AppData\Roaming\Ulead Systems\Ulead PhotoImpact\13.0資料夾
重新執行photoImpact
試用結果：印章有問題
參考網址：https://www.lifewire.com/xnb-file-2622568
by Tim Fisher
Updated October 30, 2018
A file with the XNB file extension is an XNA Game Studio Express XNA Framework Content Pipeline Binary file. It's used to save original game files into a proprietary format.
In English: an XNB file is usually a compressed file full of images that appear in a video game created with XNA Game Studio, but they may also contain additional game data like audio files.
Some software might refer to XNB files as compiled asset files.
Note: The XNB file extension looks an awful lot like XMB and might seem similar but XMB files are video game data files used in games like Age of Empires and X-Wing.
The real source of XNB files is Microsoft XNA Game Studio, a tool that works with Microsoft Visual Studio to help create video games for Microsoft Windows, Windows Phone, Xbox 360, and the (now defunct) Zune. This program, however, isn't a practical tool to extract images from XNB files.
Your best bet is a program called XNB Exporter, which is a portable (meaning no install is necessary) tool that extracts the PNG files from the compressed XNB file you're working with.
The easiest way to use this program is to copy the XNB file into the same folder as the program and then enter the file name of the XNB file without the file extension (e.g. file instead of file.xnb) in XNB Exporter, and then press Go for it!.
You might also be able to open and/or edit XNB files with the GameTools GXView tool.
Note: If you've installed GameTools but can't find GXView, you can open it directly from the installation folder, almost always here: C:\Program Files (x86)\GameTools\GXView.exe.
Tip: Some file types are text-only files and can be opened and viewed with any text editor, like Notepad in Windows, or a more advanced text editor from our Best Free Text Editors list. This isn't the case with any Game Studio XNB file, but if the one you have is a different format, this might be of some help.
If you do manage to get an XNB file opened with a text editor, but it's not entirely composed of text, there may be something within it that identifies the program used to create the file, which you then might be able to use to find a suitable program for opening it.
If the above tools don't open your XNB file, it's possible that yours has nothing to do with XNA Game Studio and isn't a plain text file, in which case it's an entirely different format instead. The best thing to do is to see what folder the XNB file is stored in, and see if that context can help you determine the program that's using it.
Note: If your file doesn't open as explained above, double-check that you're reading the file extension correctly. For example, even though XMB and XNK files resemble the XNB file extension, neither are the same as XMB and therefore don't open with the same programs.
A regular file converter will not convert XNB files. The tools we already mentioned above are designed for getting image files out of an XNB file, which is probably what you're wanting to do.
However, you may also try TExtract, TerrariaXNB2PNG, or XnaConvert if the software from above doesn't help.
XNB to WAV lets you copy out the WAV sound file from an XNB file. If you want the WAV file to be in some other sound format like MP3, you can use a free audio converter.
參考網址：https://github.com/sunshine940326/drag
<!DOCTYPE html>
<!DOCTYPE HTML>
<html>
<head>
<style type="text/css">
#div1
{float:left; width:100px; height:35px; margin:10px;padding:10px;border:1px solid #aaaaaa;}
#div2
{float:left; width:200px; height:135px; margin:10px;padding:10px;border:1px solid #aaaaaa;}
</style>
<script type="text/javascript">
function allowDrop(ev)
{
ev.preventDefault();
}
var srcdiv = null;
function drag(ev,divdom)
{
srcdiv=divdom;
ev.dataTransfer.setData("text/html",divdom.innerHTML);
}
function drop(ev,divdom)
{
ev.preventDefault();
if(srcdiv != divdom){
srcdiv.innerHTML = divdom.innerHTML;
divdom.innerHTML=ev.dataTransfer.getData("text/html");
}
}
</script>
</head>
<body>
<div id="div1" ondrop="drop(event,this)" ondragover="allowDrop(event)" draggable="true" ondragstart="drag(event, this)">
<p>ni hao!</p>
</div>
<div id="div2" ondrop="drop(event,this)" ondragover="allowDrop(event)" draggable="true" ondragstart="drag(event, this)">
<p>Hello world!</p>
</div>
</body>
</html>
參考網址：Tsung's Blog
想要將 網頁(HTML) 的內容, 直接貼到 Word 上, 然後希望可以控制 Word 分頁(做報告方便), 要使用哪個 HTML Tag 呢?
懶得看下述作法的, 可以直接使用結論, 就是下述 Tag.
<br style="page-break-before:always;">
找 Word 分頁用的 HTML Tag 或參數的方法
註: 使用 <p>、<div>… 加上這 style 都不行, 一定要 <br> 才可以.
用相同的方法可以找出控制頁面邊界的CSS
<style media="print" type="text/css">
<!--
/* Page Definitions */
@page WordSection1
{size:595.3pt 841.9pt;
margin:1.0cm 1.0cm 1.0cm 1.0cm;
layout-grid:18.0pt;}
div.WordSection1
{page:WordSection1;}
-->
</style>
記得把class套用上去
<div class=WordSection1>
{{ include file= $content_file }}
</div>
@page 是列印模式下對頁面配置的特殊屬性，主要可設定頁面的 size, margin , orphans 和 widow。
@page{
size: A4 portrait;
margin: 0.5cm;
orphans:4;
widows:2;
}
元素後要被分頁嗎? page-break-after : auto | always | avoid | left | right
元素前要被分頁嗎? page-break-before : auto | always | avoid | left | right
元素本身要被分頁嗎? page-break-inside : auto | avoid
這三個屬性超重要!!!網頁內容無法預估長度的情況下，很難完美的呈現頁面布局，盡可能做到的就是避免顯示的元素被分頁切割。
h1, h2, h3, h4, h5, h6 {
page-break-after:avoid;
page-break-inside:avoid
}
h1+p, h2+p, h3+p {
page-break-before: avoid;
}
a {
page-break-inside:avoid
}
img{
page-break-after: avoid;
page-break-inside: avoid;
}
table, blockquote{
page-break-inside: avoid;
}
ul, ol, dl {
page-break-before:avoid;
}
/* 如架構本身用一組一組的 DIV 包住，也可強制設定每組 DIV 會各自切成一頁 */
div.pageBlock{
page-break-before: always;
}
雖然無法讓想要的內容全部塞在同一頁，但利用 page-break 至少可以限制分頁的斷點判斷~整體閱讀起來也比較舒服了!!
在chrome中預覽列印遇到大檔時，速度會變得很慢，甚至當機。
找來firefox測試，同樣的網頁，預覽速度很正常。
筆記一下firefox預覽列印的方式
firefox必需點選右上角的列印按鈕才會進入列印預覽模式。
另一個找到預覽列印的方法是按Alt鍵，上方會出現工具列，再從檔案功能中下拉，就可以找到預覽列印了。
還有個方法就是安裝Print Preview Button這個外掛，就會在右上角出現預覽列印按鈕。
chrome預覽列印時可以選擇不同紙張大小，firefox則不行。firefox的預覽列印顯然弱了點。
firefox不同紙張的變通方式，用縮放模擬。(B4–>A4 為81%)