Blogger的插入圖片

在Blogger中使用預設的工具插入圖片
有時候會覺得照片看起來糊糊的
那是因為Blogger在上傳圖片的時候幫你做了兩件事

首先，如果圖檔的長或寬有一邊超過1600px
那他就會先幫你重新壓縮成1600為最大

第二，在顯示圖檔的時候，他會是以長邊為400的縮圖來顯示的
因為在選定的時候大小就只有200,320,400三種大小而已
這樣可以讓圖的載入速度變快，但是有時就會覺得畫質不好

在加入圖案的時候，選擇修改Html，可以看到原始碼

<a
onblur="
try {parent.deselectBloggerImageGracefully();}
catch(e) {}"
href="http://4.bp.blogspot.com/_7YTvBjsH78k/
SoT-IhmThfI/AAAAAAAAApM/Ax3wDbQ4uBw/s1600-h/
use+case+1.png">
<img
style="display:block; margin:0px auto 10px;
text-align:center;cursor:pointer;
cursor:hand; width: 400px; height: 320px;"
src="http://4.bp.blogspot.com/_7YTvBjsH78k/
SoT-IhmThfI/AAAAAAAAApM/Ax3wDbQ4uBw/s400/
use+case+1.png"
border="0"
alt=""
id="BLOGGER_PHOTO_ID_5369696078143915506"
/>
</a>

上面紅字的地方，就代表著使用400px的縮圖為來源
所以我們把它修改成s1600
就會是以最高解析度的原圖顯示了

--
參考資料
Blogger圖片大小的控制
Blogger上傳圖片的原始碼解析

在Blog中加入表格

在blog中如果將表格從別的軟體貼過來
常常格式會亂掉
如果變成圖片再貼過來又覺得解析度不太好
這時候就直接用html來製作表格吧

在設定css的地方，以Blogger為例
自訂->版面配置->修改HTML 找到

body {
...
}

然後加入

table {
border-collapse: separate;
border: 1px solid #999999;
width: 100%;
margin: 10px 0px 10px 0px;
}

th {
border: 1px solid #999999;
background-color: #eeeeee;
text-align: center;
}

td {
border: 1px solid #999999;
}

然後新增文章裡面直接修改html，加入

<table><th>標題1</th><th>標題2</th></tr><tr><td>內容1-1</td><td>內容2-1</td></tr><tr><td>內容1-2</td><td>內容2-2</td></tr></table>
就會變成

標題1	標題2
內容1-1	內容2-1
內容1-2	內容2-2

注意，這裡不能換行，因為blogger會自動將換行符號
轉換成<br>，讓表格上方多出一堆空白

語法遵照CSS的標準

標籤	參數	說明
table	border-collapse	內框線與外框線分離
	border	框線的型態，設成細灰線
	width	寬度，設成填滿所在框架的寬度
	margin	外邊界，分別是上左下右邊界的寬度
th	border	框線的型態，設成細灰線
	background-color	填滿色彩，設成淺灰色
	text-align	文字對齊方式，置中
td	border	框線的型態，設成細灰線