bootsrap 外边距_bootstrap常见class汇总及其他笔记

一.container 最外部容器

作用:对不同屏幕规定不同大小样式宽度,并且设置15像素左右内边距,居中

二.网格相关

row 行 使用行在水平方向创建一组列,设置左右15px外边距,抵消外部容器container在两侧的15px留白。

col-*-*: 列 (第一个*可以为xs[超小]/sm[小型]/md[中型]/lg[大型]第二个*必须为12以内的[列数])

col-*-offset-* :列偏移(第一个*和上面一样,第二个*范围是1到11,表示把该列的左外边距(margin)增加*列)

col-*-*-*:列排序(第一个*和上面一样,第二个*可以为push[向右]/pull[向左],第三个*范围是1到11[列数])

三.概述

1.使用Html5

2.移动先行之meta标签,通过添加user-scalable=no,禁用收放功能,用户只能滚动屏幕。

即 

3.响应式图片           为img元素添加class:img-responsive

4.排版链接相关,body的margin设为0,背景白色,默认字体Helvetica Neue、 Helvetica、 Arial 和 sans-serif,大小14px.line-height,1.4(20/14).

四.基础排版

1.重新调整了标题h1到h6,大小以14px为系数

h1到h3,系数分别为2.6,2.15,1.7,上外边距20px,下外边距20px

h4到h6,系数分别为1.25,1,0.85,上外边距10px,下外边距10px

其余待续

2.表格

able:基本样式(只有横向分隔线)

table-*:表格样式(*可以为striped[添加条纹]/bordered[添加边框]/hover[启用悬停]/condensed[更加紧凑])

tr/th/td 有active/success/info/warning/danger来改变背景颜色

将任意的table放在class为table-responsive的元素内,实现响应式表格

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值