zoukankan      html  css  js  c++  java
  • 前端之bootstrap

    简介

    Bootstrap 是最受欢迎的 HTML、CSS 和 JS 框架,用于开发响应式布局、移动设备优先的 WEB 项目

    jQuery导入

    Bootstrap它是基于jQuery,也就意味着你在用bootstrap要先导入jQuery文件

    导入jQuery方式有两种,这里采用CDN方式导入

    百度bootcdn进入这个界面并点击红色框

    然后选择3.4.1版本里的相关js文件

    布局容器

    <div class="container "></div> 左右有固定留白
    <div class="container-fluid c1"></div> 全屏展示

    栅格系统

    一个row就表示一行(这一行默认给你均分成了12份,每一份你还可以均分成12份)

    首先使用bootstrap先写一个布局容器
    <div class='container'></div>         #留白
    <div class='container-fluid'></div>


    <div class="container">
    <div class="row"> 一行
    <div class="col-md-6 c1"></div> 控制你占当前行的多少列
    <!--借助谷歌浏览器自动切换手机或电脑屏幕,只需要加一个col-xs-6生成对应的布局-->
    列偏移
    col-md-offset-3

    浮动
    pull-left
    pull-right

    表格

    <table class="table table-hover table-bordered table-striped">

    按钮
    <button class="btn btn-success">button</button>
    <button class="btn btn-info">button</button>
    <button class="btn btn-warning">button</button>
    <button class="btn btn-danger">button</button>
    <button class="btn btn-primary">button</button>
    <a href="http://www.xiaohuar.com" class="btn btn-primary">Link</a>  #把a标签附上button属性

    图标

  • 相关阅读:
    iOS之蓝牙开发—CoreBluetooth详解
    iOS-GCD使用详解
    iOS—Mask属性的使用
    idea导入eclipse中的maven项目
    SQL Server 查找字符串中指定字符出现的次数
    lLinux的常用命令
    从excel表中生成批量SQL
    ORA-00911: invalid character 错误解决
    sqlserver sp_who2和inputbuffer的使用,连接数
    如果存在这个表,则删除这个表的sql
  • 原文地址:https://www.cnblogs.com/zhangdajin/p/10976722.html
Copyright © 2011-2022 走看看