XOOPS輕鬆架 - 線上書籍

:::

XOOPS 研習講義
==========

### 一、後台設定技法

1. 後台佈景設定中的區塊設定可對每個區域的區塊調整標題外觀
2. 若是想調整成這樣： 
 ![](https://campus-xoops.tn.edu.tw/uploads/tad_book3/image/18/block2.png)
3. 則可照著以下內容設定： 
 ![](https://campus-xoops.tn.edu.tw/uploads/tad_book3/image/18/block_title.png)
4. 邊框產生器：<http://border-image.com>
5. 範例圖：![](https://campus-xoops.tn.edu.tw/uploads/tad_book3/image/b.png)![](https://campus-xoops.tn.edu.tw/uploads/tad_book3/image/18/window-gui-hi.png)![](https://campus-xoops.tn.edu.tw/uploads/tad_book3/image/18/btitle.png)![](https://campus-xoops.tn.edu.tw/uploads/tad_book3/image/18/bbody.png)
6. CSS樣式屬性以及可用的值可從這裡查詢：[ http://css.doyoe.com](http://css.doyoe.com)
7. 文字陰影產生器：<https://www.we-shop.net/css3/text-shadow.html>
8. 建議的「區塊整體樣式」指的就是「整個區塊」的外觀： 
 ```css
 background: rgba(255, 255, 255, 0.5);
 border: none;
 border-radius: 6px;
 padding: 0px;
 margin:0px 0px 20px;
 ```
 
 花邊框範例
 
 
 ```css
 border-style: solid; 
 border-width: 21px 27px 27px 24px; 
 border-image: url(https://campus-xoops.tn.edu.tw/uploads/tad_book3/image/b.png) 21 27 27 24 fill repeat;
 margin-bottom: 3rem;
 
 ```
9. 建議的「區塊標題樣式」指的就是「區塊標題」的外觀： 
 ```css
 padding: 6px; 
 text-align:center;
 font-family: 微軟正黑體;
 background: linear-gradient(to bottom, #f6f8f9 0%,#e5ebee 50%,#d7dee3 51%,#f5f7f9 100%);
 /* text-shadow: -1px -1px 0 #2e2e2e, 1px 1px 0 #d2d2d2; */
 text-shadow: 0px 1px #0d4e5c, 1px 0px #0d4e5c, -1px 0px #0d4e5c, 0px -1px #0d4e5c, -1px -1px #0d4e5c, 1px 1px #0d4e5c, 1px -1px #0d4e5c, -1px 1px #0d4e5c;
 ```
10. 建議的「區塊內容樣式」指的就是「區塊內容」的外觀 
 ```css
 padding: 5px 0px 10px;
 ```
 
### 二、特殊技法

1. 注意！並非所有佈景都支援此功能。（所有有支援 tad\_theme 的佈景都有支援） 
 ![](https://campus-xoops.tn.edu.tw/uploads/tad_book3/image/18/logconuterx.png)![](https://campus-xoops.tn.edu.tw/uploads/tad_book3/image/18/mainmenu.png)![](https://campus-xoops.tn.edu.tw/uploads/tad_book3/image/18/openid.png)![](https://campus-xoops.tn.edu.tw/uploads/tad_book3/image/18/tadnews.png)![](https://campus-xoops.tn.edu.tw/uploads/tad_book3/image/18/usermenu.png)![](https://campus-xoops.tn.edu.tw/uploads/tad_book3/image/18/about_school.png)![](https://campus-xoops.tn.edu.tw/uploads/tad_book3/image/18/school_unit.png)![](https://campus-xoops.tn.edu.tw/uploads/tad_book3/image/18/theme.png)
2. 以圖片取代區塊標題：「區塊標題**\[pic\]****http://圖片網址**」
3. 以圖片取代區塊標題（並套用區塊標題設定）：「區塊標題**\[img\]****http://圖片網址**」
4. 加入小插圖：「區塊標題**\[icon\]****http://圖片網址**」
5. 藏區塊標題：「區塊標題**\[hide\]**」
6. 加入連結：「區塊標題**\[link\]http://網址**」
7. 向量圖示：[http://www.flaticon.com](http://www.flaticon.com/)、<http://emojione.com/>（[下載所有圖檔](https://www.emojione.com/developers/download)）
8. 搜尋圖示：<http://findicons.com>

:::

書籍目錄

展開 | 闔起

快速登入

進階搜尋

https%3A%2F%2Fcampus-xoops.tn.edu.tw%2Fmodules%2Ftad_book3%2Fmarkdown.php%3Ftbdsn%3D317

計數器

今天：
昨天：
總計：

MarkDown

書籍目錄

快速登入

計數器