22. bootstrap元件#巨幕和旋轉圖示
阿新 • • 發佈:2021-06-18
bootstrap元件#巨幕和旋轉圖示
巨幕不用怎麼學 這玩意卡片我覺得都可以替代它...
1. 巨幕jumbotron
基類 是 .jumbotron 然後就沒了,,,,,,,可以在裡面新增各種元件 和樣式而已:
巨幕的寬度會制動佔據100%
<!-- 巨幕的寬度會制動佔據100% 背景顏色自己改啊! --> <div class="jumbotron " style=" height: 310px;"> <p class="text-primary">中山市Bi-Hu科技公司</p> <h1 class="display-4">盛 大 開 業</h1> <p class="text-secondary ml-5 mt-2">2021.10.10</p> <hr class=""> <p class="text-info">百年傳奇,堅守百年傳承,沉澱歲月靈感,很難說無可挑剔,但從未停步。</p> <div class="text-center"><h3>敬 請 期 待 ..</h3></div> </div>
打廣告用的吧...
2.旋轉圖示:
Spinners
有兩種 一種是 轉圈圈的 另一種是 外擴散
基類:
轉圈圈:spinner-border
點擴散:spinner-grow
例:
<!-- 預設是黑灰色 --> <div class="spinner-border"></div> <div class="spinner-grow"></div>
emmmm:它類似於text 顏色、什麼的直接用 text-* 改即可:
<!-- 預設是黑灰色 修改顏色 text-*即可 甚至你可以往裡面加文字 --> <div class="spinner-border text-primary"></div> <div class="spinner-grow text-warning"><p class="text-white text-center align-middle">1</p></div>
關於微調 自己用 外面局 m-* 或者 m*-* 你懂得...
然後還有組合 和 尺寸 :
尺寸 直接 基類-sm/lg 這個不多說,然後組合【例如 和按鈕組合】:
<!-- 和按鈕組合起來: 顏色自己換即可--> <div class="btn btn-success m-5" > <div class="spinner-border spinner-border-sm "></div> login... </div>
沒什麼好說的了 本來就沒什麼東西...
然後