前端学习之BootStrap4

介绍

  1. 介绍
    (1)BootStrap:UI组件,前端组件框架
    (2)主要作用:响应式框架:响应在移动端、pc端:适应布局。

  2. 支持的浏览器版本与设备兼容
    响应式,所以pc端、移动端都兼容

学习

表严肃课程资料
BootCDN:稳定、快速、免费的前端开源项目集合平台。
BootStrap中文文档
BootStrap开发文档

内容

  1. 所用Bootstrap地址
    在< h1 > 之前加:
    < link rel
    =“stylesheet” href="(上面链接)"></ link>

  2. 栅格系统:
    (1)横向分割空间;
    (2)分割的同时考虑到响应式
    容器的分块——侧栏、内容。

  3. 表单form的大小、样式——常用:form-group,form-control

  4. 按钮button的大小、样式——btn;按钮组btn-group

  5. 导航相关组件:
    (1)局部导航:nav nav-tabs、nav-pills (nav-stacked)
    (2)全局导航:导航栏:navbar
    (一般li在ul里面)

  6. 面板pannel的样式设置

  7. 表格table:table

  8. 其他的组件:
    (1)翻页下标栏:ul-pagination:第一页active,最后一页:disabled
    (2)路径导航:breadcrumb:显示当前页面所在网站位置:之前:链接;当前页:active;
    (3)列表组:list-group-item:“投票”栏。

猜你喜欢

转载自blog.csdn.net/qq_43642447/article/details/106108583