python_note
  • Introduction
  • My Python
    • Anaconda
    • argparse
    • datetime
    • json
    • logging
    • numpy
    • open
    • openCC
    • pandas & csv
    • Socket & SocketServer
    • re
    • yaml
    • smtp
    • 物件操作
    • unittest
    • 線程
    • prettytable
    • IO
    • pycurl
    • sys
    • pickle
    • auto-python-to-exe
    • cython
    • nuitka
  • Crawler
    • Urllib & Requests
      • User-agent
      • Percent-Encoding
      • mail code
    • Selenium
    • TCP & UDP
    • 控制字符(control character)
  • Web Development
    • Flask
      • RESTful api
      • Template
      • blueprint
    • Django
      • 環境佈署(windows)
    • 檢查Port
    • Apache
    • 使用者行為
    • jQuery
    • 壓力測試
    • DataTable
    • Bootstrap
    • CSS
    • JavaScript
    • Chart.js
  • Deep Learning
    • Keras 設定
    • RNN
    • LSTM
  • Test
    • T-Test
  • 資料結構
    • Hash
    • 時間複雜度
  • NLP
    • N-gram
    • CKIP
    • 中文轉數字
    • CRF
    • Mutual Information
    • 模糊比對
  • Linebot
    • Heroku
    • 圖文選單
    • channel
  • Linux
    • 常用指令
    • shell script
    • sshfs
    • ssh
    • nodejs & npm
    • debug
  • GCP
    • app engine
    • ssh(gcp)
    • gsutil
    • brabrabra
    • Load Balancer
    • k8s
  • Database
    • mysql
    • elasticsearch
      • Query
      • Backup and Restore
      • elasticdump
      • es2csv
      • ELK
    • mongodb
      • install
      • authentication
      • pymongo
    • sql server
  • go
    • Swarm
  • Docker
    • Kitematic
    • Dockerfile
    • Swarm
  • Git
  • 其他
    • USB軟體保護
    • Windows效能監視器
  • Blockchain
Powered by GitBook
On this page

Was this helpful?

  1. Web Development

Bootstrap

PreviousDataTableNextCSS

Last updated 5 years ago

Was this helpful?

參考不同網頁性質的排版方式

B3 B4教學

有各式各樣範例,找素材的好地方,語法與CSS名稱略有不同

Input Group Button 搜尋框+搜尋按鈕

點選文字顯示提示訊息

呈現社群媒體圖文排列

點擊縮放區塊

分頁切換畫面

固定在視窗旁邊的選單

固定在視窗上面的選單

表單驗證 (未測試)

同行排列

預設字體設定

跳出互動對話框,可用button或a觸發

觸發完後關閉對話框

$('.form_modal').modal('hide');

https://v4-alpha.getbootstrap.com/examples/
https://getbootstrap.com/docs/4.0/examples/
http://wowslider.com/posts/35-top-free-bootstrap-templates-2016-95.html
https://startbootstrap.com/themes/
https://www.w3schools.com/bootstrap/default.asp
https://www.w3schools.com/bootstrap4/default.asp
https://getbootstrap.com/docs/4.0/components/alerts/
https://mdbootstrap.com/docs/jquery/layout/grid-usage/
https://www.w3schools.com/bootstrap/tryit.asp?filename=trybs_form_input_group_btn&stacked=h
https://www.w3schools.com/bootstrap/bootstrap_popover.asp
https://www.w3schools.com/bootstrap/bootstrap_media_objects.asp
https://www.w3schools.com/bootstrap/bootstrap_collapse.asp
https://www.w3schools.com/bootstrap/bootstrap_tabs_pills.asp
https://www.w3schools.com/howto/tryit.asp?filename=tryhow_css_sidenav_fixed2
https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_navbar_sticky
https://codertw.com/%E5%89%8D%E7%AB%AF%E9%96%8B%E7%99%BC/248742/
https://www.wfublog.com/2017/09/bootstrap-form-validator.html
http://1000hz.github.io/bootstrap-validator/
https://v4-alpha.getbootstrap.com/utilities/display-property/
http://dev.sopili.net/2013/03/bootstrap-css.html
https://www.w3schools.com/bootstrap/bootstrap_modal.asp
https://dotblogs.com.tw/newmonkey48/2017/06/02/113416