前端框架之bootstrap简介

Bootstrap框架

        Bootstrap框架
            2.X 3.X 4.X  # 推荐使用3.X版本

        使用框架调整页面样式一般都是操作标签的class属性即可

        bootstrap需要依赖于jQuery才能正常执行(动态效果)

        引入方式
            本地引入(最完整的)
                1.引入jQuery
                2.引入bootstrap的css文件
                3.引入bootstrap的js文件
            CDN引入
                1.引入jQuery CDN
                2.引入bootstrap css的 CDN
                3.引入bootstrap js的 CDN

        """placeholder 属性提供可描述输入字段预期值的提示信息"""

布局容器

        """
        第一次使用该框架的时候最好采用本地导入的方式 
        让pycharm记住bootstrap的关键字
        """
        container		左右留白
        container-fluid  左右不留白

栅格系统

        row			行  # 一个row就是一行 一行是固定的12份
        col-md-1	占几份
        col-sm-1	占几份
        col-xs-1	占几份
        col-lg-1	占几份

图标

        bootstrap自带的
            通过span标签修改class属性值
        fontawesome网站
            专门提供图标库  # 完美兼容bootstrap框架
posted @ 2022-02-17 15:10  丶祈安  阅读(109)  评论(0)  编辑  收藏  举报