Bootstrap
关注
分享
扫一扫
文章平均质量分 77
Bootstrap前端框架
_洋
一起学习吧
展开
-
Bootstrap应用
文章目录bootstrap实现导航栏Bootstrap实现轮播图bootstrap实现导航栏<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" conten原创 2022-05-11 09:03:43 · 328 阅读 · 0 评论 -
Bootstrap定制化
在使用Bootstrap框架的时候我们有可能需要修改他已经写好的样式，但是直接在Bootstrap的源码中修改可能会破坏源码的结构，不推荐这样做。这就引入了定制化，新建less文件，@import 引入bootstrap.less 文件，在下面重新样式，将之前的样式覆盖掉。eg：my.less:@import "./less/bootstrap.less";@grid-gutter-width:200px;html引入my.css:<!DOCTYPE html><html原创 2022-05-10 19:03:18 · 345 阅读 · 0 评论 -
响应式布局——Bootstrap
文章目录源码解析源码源码分析响应式布局的例子源码解析源码responsive-utilities.less：@-ms-viewport { width: device-width;}.visible-xs,.visible-sm,.visible-md,.visible-lg { .responsive-invisibility();}.visible-xs-block,.visible-xs-inline,.visible-xs-inline-block,.vi原创 2022-05-10 15:19:52 · 184 阅读 · 0 评论 -
Bootstrap栅格布局解析
文章目录栅格布局初始栅格栅格布局源码栅格布局源码分析流体容器&固定容器公共样式@grid-gutter-width：槽宽，设置栅格中的padding值，防止文字紧贴固定容器的栅格样式栅格行的定义栅格列的定义make-grid-columns()——设置列的padding、positionmake-grid——设置列的float，width栅格布局使用栅格实例bootstrap组件的使用缩略图需求：响应式布局换行的时候想要从前面掉下去栅格布局初始栅格栅格布局默认将一行分成12列，Bootstra原创 2022-05-10 10:39:02 · 3078 阅读 · 0 评论 -
Boostrap容器
文章目录流体容器——container-fluid固定容器——container栅格布局初始栅格栅格布局源码栅格布局源码分析流体容器&固定容器公共样式@grid-gutter-width：槽宽，设置栅格中的padding值，防止文字紧贴固定容器的栅格样式栅格行的定义栅格列的定义make-grid-columns()make-gridBoostrap有很多容器，下面进行介绍流体容器——container-fluid.container-fluid { padding-right: 15p原创 2022-05-10 08:19:44 · 145 阅读 · 0 评论 -
Bootstrap简介
Bootstrap简介文章目录Bootstrap简介什么是BootstrapBootstrap官网Bootstrap文档下载Bootstrap使用Bootstrap基本框架Bootstrap简介什么是BootstrapBootstrap是最受欢迎的HTML、CSS 和JS框架，用于开发响应式布局、移动设备优先的WEB项目。Bootstrap官网https://www.bootcss.com/Bootstrap文档下载地址：https://v3.bootcss.com/Bootstrap原创 2022-05-08 08:07:40 · 182 阅读 · 0 评论