Toggle main menu visibility
新聞
下載
教材
影音
討論
其他選單
好站連結
行事曆
電子相簿
常見問題
萬用表單
即時留言簿
友站消息
社大學員
:::
登入
登入
帳號
密碼
登入
重整畫面
:::
所有書籍
「Groundwork CSS」目錄
MarkDown
9. 文字 ResponsiveText
1. 預設空白頁面
2. 格線系統 The Grid
3. 按鈕 Buttons
4. 導覽列 Navigation
5. 頁籤 Tabs
6. UI元件 UI Elements
7. 表格 Tables
8. 圖示 Social Icons
9. 文字 ResponsiveText
10. 彈跳視窗（燈箱） Modals
11. 提示 Tooltips
12. 滑動 Orbit
11. 提示 Tooltips
Groundwork CSS ============== ### 行內彈跳視窗 - class="modal"可將之變成一個彈跳視窗（點了才會出現的視窗） - 按鈕的 href 連結要和視窗的 id 相對應 ``` <p><a class="button" href="#example-modal">行內彈跳視窗</a></p> <div id="example-modal" class="modal"> 視窗內容 </div> ``` ### 以連結來當作視窗內容 - 主要就是將連結改為 class="modal button" - href 的值為一般網址。 - 不須要有對應內容 ``` <p><a class="modal button" href="連結網址">外部內容 <i class="icon-external-link"></i></a></p> ``` ### 開啟Youtube - 直接將影片網址填入即可 ``` <p><a class="modal button" href="http://www.youtube.com/embed/eDO23-eLoGA">YouTube 影片</a></p> ```
:::
搜尋
search
進階搜尋
QR Code 區塊
快速登入
所有討論區
「PHP全端開發」線上課程討論區
XOOPS使用討論區
一般研習學員
社大學員專用
路過哈啦區
XOOPS佈景設計
XOOPS模組開發
Tad書籍區
即時留言簿
書籍目錄
展開
|
闔起
線上使用者
140
人線上 (
80
人在瀏覽
線上書籍
)
會員: 1
訪客: 139
tad
,
更多…
9. 文字 ResponsiveText
