以下是部落格迴響區塊 CSS 的說明與範例

*預設CSS
這段CSS會出現在每位會員的樣式表中,做為預設的排版樣式,大家可再修改喔

/*------------------------------ #comment-table ------------------------------ */
#comment-form table { width: 96% ; margin: 0 auto ;}
#comment-form td , #comment-form th { border: 1px solid #555 ; padding: 3px 5px; }
#comment-form input#send-comment { padding: 3px 5px ; }

*進階CSS
以下是迴響表格中會出現的標籤,可隨意增加樣式宣告進去

/*----- 本篇迴響權限 -----*/
#comment-form p { }

/*----- 整個迴響表格 -----*/
#comment-form table { }

/*----- 迴響表格標題欄 -----*/
#comment-form th { }

/*----- 迴響表格內容欄 -----*/
#comment-form td { }

/*----- 留言人資訊輸入框 -----*/
#comment-form input { }

/*----- 留言內容框 -----*/
#comment-form textarea { }

/*----- 確認送出鈕 -----*/
#send-comment { }

*範例CSS



適合白背景或是淺色系背景:
#comment-form { border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; background: #fff; padding: 5px; margin: 10px auto; }
#comment-form table { color: #888; width: 100%; }
#comment-form table th {border:none; }
#comment-form table td { color: #888; vertical-align: top; padding: 2px 5px; border:none; }
#comment-form input { height: 17px; font-family: "Arial"; font-size: 12px; color: #000; border: 1px solid #ccc; background: none; }
#comment-form textarea { width: 98%; height: 90px; font-family: "Arial"; font-size: 12px; line-height: 18px; color: #000; border: 1px solid #ccc; background: #fff; }


適合黑背景或是深色系背景:
#comment-form { border-top: 1px solid #444; border-bottom: 1px solid #444; background: #000; padding: 5px; margin: 10px auto; }
#comment-form table { color: #888; width: 100%; }
#comment-form table th {border:none; }
#comment-form table td { color: #888; vertical-align: top; padding: 2px 5px; border:none; }
#comment-form input { height: 17px; font-family: "Arial"; font-size: 12px; color: #fff; border: 1px solid #ccc; background: none; }
#comment-form textarea { width: 98%; height: 90px; font-family: "Arial"; font-size: 12px; line-height: 18px; color: #fff; border: 1px solid #333; background: #333;}

全站熱搜

痞客邦站方公告 發表在 痞客邦 留言(84) 人氣()