class 設定

fn-sel
大部分的.fn-***均需要加入 .才會起作用, 除了 或

fn-clone
可對該物件進行複製, 通常會與, 共用

fn-component
令其物件可選擇插入編輯元件, 通常會與, 共同使用, 搭配 .fn-sectopic 使其可插入/移除 .topic-cont (標題物件)。若在上層/父物件設置 .sectnav-content，則該<section.>物件可設置屬性"sectnm"，搭配bootstrap的滾動監控 (Scrollspy)使用。

fn-undel
對於 或 之物件, 禁止刪除，亦無法拷貝。

fn-order
讓該物件可在同層的區域內調整前後順序

fn-edit
例如<span></div>, 在後台頁面載入時會產生 contenteditable="true" 的屬性,使該標籤可以做簡單文字編輯

fn-ckedit
使該標籤成為富文本編輯(ckeditor套件), 需與共用, 不可用於<span>或<p>標籤, 標籤啟用ckeditor須有該頁面獨立不重複的id, 例如 <div id="edit01"></div>,

fn-imgset
使該圖片可以換置後台上傳的圖片, 例如 <img src="/files/home/index01.jpg">, 只能使用在<img>標籤上

fn-bgset
使該標籤可以換置後台上傳的圖片及背景顏色, 例如 <div style="background-image:url(/files/home/index01.jpg);"></div>

fn-bgpos
使該標籤的背景圖片可以調整background-size為 contain、cover、或百分比, 例如 <div style="background-image:url(/files/home/index01.jpg);"></div>
註:無法使用在 parallax的背景設置

fn-parallax
使rd-parallax物件可以換置後台上傳的圖片, 例如 <div class=" rd-parallax"> ... </div>

fn-link
使該物件可設置超連結，需設置於<a>標籤中

fn-modalink
用以設定連結來開啟modal資訊視窗

fn-youtube
使該物件可設置子物件iframe的影片連結，完整語法為
<div class="embed-responsive embed-responsive-16by9">
    <iframe allowfullscreen="1" frameborder="0"></iframe>
</div>

fn-inhemb
此功能讓使用者可以選擇該區塊是使用本頁的欄位內容/html, 或者繼承上層頁面的欄位內容/html. . 僅能搭配 inh: 或者 emb:使用

fn-slickset
使slick slider 輪播的 .slick-slide 物件可新增/複製/刪除、若要提供給使用者能夠新增.slick-slide,的功能, 必須在 .物件上加入 data-item='<div class="items-block ...">...</div>'

fn-slickctrl
讓slick slider 可做一些data-slick屬性的微調, 包含responsive的設置; 用來設定不同裝置尺寸 xl, lg, md...下撥放/輪播張數

fn-icon
用於等inline或inline-block之標籤, 供選擇/換置font icon的樣式, 例如 <span class=" fa fa-times"></span>

fn-col
用於.row > .col 物件, 提供flex-box網格設置,例如 <div class="row"><div class=" col-xl-6"></div></div>

fn-colorder
用以調整flex col物件的 order規則, 例如 <div class="row"><div class=" col-xl-6"></div><div class=" col-xl-6"></div></div>

fn-cell
用於.cell-row > .cell-xl-6 物件, 提供float網格設置,例如 <div class="cell-row"><div class=" cell-xl-6"></div></div>

fn-zidx
用以調整物件的 z-index 規則, 例如 <div></div>

fn-pt、fn-pb、fn-pl、fn-pr
用以開啟單位為rem 的 padding class 設定, 與bootstrap 4 的 padding class相同, 但只能設定上下左右, 無法設定水平/垂直, 例如 <div></div>

fn-pdt、fn-pdb、fn-pdl、fn-pdr
用以開啟單位為% 的 padding class 設定, 與bootstrap 4 的 padding class相同, 但只能設定上下左右, 無法設定水平/垂直, 例如 <div></div>

fn-mt、fn-mb、fn-ml、fn-mr
用以開啟單位為rem 的 margin class 設定, 與bootstrap 4 的 margin class相同, 但只能設定上下左右, 無法設定水平/垂直, 例如 <div></div>

fn-mgt、fn-mgb、fn-mgl、fn-mgr
用以開啟單位為% 的 margin class 設定, 與bootstrap 4 的 margin class相同, 但只能設定上下左右, 無法設定水平/垂直, 例如 <div class="-mgt "></div>

fn-textalign
讓使用者在RWD的環境中, 為不同的尺寸寬度設定文字區塊靠左/右/置中, 或者斷行與否!

fn-color
讓調整物件的文字顏色!

fn-colcount、fn-colgap
讓使用者在RWD的環境中, 為不同的尺寸寬度設定文字區塊 column-count 規則! 搭配 . 用以設定 column-count 所產生的多欄文字, 欄位間的距離, . 通常與並用

fn-border
讓物件可設定邊框樣式/大小/圓角/.顏色