表格的圖文整合寫作：實例一

表格的圖文整合寫作：實例一

表格使用的優點在於，可以創造出某種版面結構上的秩序感。秩序感是平面構成重要的美 感原則。

秩序感即是韻律感。韻律感是一種系統化的過程。「韻律感比起構圖的其他基本原理，還 要更具有影響力些。它的存在是如此有活力，因此即使是記錄韻律感的最平 凡主體，也能形成一張賦予深刻印象的照片」（Clements & Rosenfeld／塗紹基譯：1983，183；click↗）。

這是陽明山的黃昏 大約下午 五點左右，落日的顏色就會是完全的讓人相信時間的到來。即使某種程度陰天，也只是造就了更好的炫爛。		春天盛開的風潮 春天的到來，是無法讓櫻花躲過的宿命。一種用盡力的生命搏鬥，讓人觸目心 驚。沒有人知道，花是否同時都知道，那一種不可錯過的時 刻，是多年潛藏的等待。

本頁所使用之CSS：

<style>

/* 本文大標 */
.bigtitle010403 {
font-family: Verdana, '微軟正黑體';
font-size: 2.4em;
font-weight: bold;
line-height: 1.2;
text-align: left;
letter-spacing: 0.02em;
margin-bottom: 0.1em;
text-shadow: 1px 1px 2px silver;
}

/* 大標後粗體摘要*/
.ironcontentbo010403 {
font-family: Verdana, '微軟正黑體';
font-size: 1.07em;
font-weight: bold;
line-height: 1.2;
text-align: justify;
text-justify: inter-ideograph;
letter-spacing: 0.1em;
}

/* 基本黑體內文*/
.ironcontentno010403 {
font-family: Verdana, '微軟正黑體';
font-size: 1.11em;
font-weight: normal;
line-height: 1.8;
text-align: justify;
text-justify: inter-ideograph;
letter-spacing: 0.1em;
}


/*表格內小標 */
.littletitle010403 {

font-family: Verdana, '微軟正黑體';
font-size: 1.06em;
font-weight: bold;
line-height: 1.4;
text-align: left;
letter-spacing: 0.06em;
margin-bottom: 0.4em;
border-bottom: 1px solid gray;
}

.littletitle010403::before {
content:"^";
color: red;
margin-right: 0.5em;
}

/* 表格內基本細明體 */
.ironcontentmi01040 {
font-family: Verdana, '新細明體';
font-size: 15px;
font-weight: normal;
line-height: 2;
text-align: justify;
text-justify: inter-ideograph;
letter-spacing: 0.1em;
}

/*表格圖片互動，請放在 table*/
.tabimgint0403 {
}

/*和上面CSS是共同一組*/
.tabimgint0403 td:hover >img {
position: relative;
top: -6px;
}

</style>

教學影音：

參考書目：

Clements, B., & Rosenfeld, D. ／塗紹基譯（1983）。《攝影構圖》。台北：眾文圖書。