概述 布局您的Bootstrap项目的组件和选项,包括包装容器、强大的网格系统、灵活的媒体对象和响应性实用工具类。
Layout布局 通过基础的24分栏,迅速简便地创建布局。 基础布局 使用单一分栏创建基础的栅格布局。
Layout布局 协助进行页面级整体布局。 设计规则 尺寸 一级导航项偏左靠近logo放置,辅助菜单偏右放置。 顶部导航(大部分系统):一级导航高度64px,二级导航48px。
Container布局容器 用于布局的容器组件,方便快速搭建页面的基本结构: <el-container>:外层容器。
表-布局 该table-layoutCSS属性指定用于铺陈算法
这些尺寸编号的顺序并不意味着形状布局中的特定次要/主要顺序。布局由Layout原型确定。 按照惯例,维度按维度编号的升序排列。
CSSFlexibleBoxLayout CSS柔性盒布局是CSS的一个模块,它定义了为用户界面设计优化的CSS框模型。
CSSGridLayout CSS网格布局擅长将页面划分区域,或根据HTML原语构建的控件的各个部分之间的大小、位置和层定义关系。 与表一样,网格布局使作者能够将元素对齐为列和行。
CSS网格布局:网格布局的关系 CSS网格布局被设计为与CSS的其他部分一起工作,作为完成布局的完整系统的一部分。在本指南中,我将解释网格是如何与您可能已经使用的其他技术结合在一起的。
CSS网格布局:使用CSS网格实现公共布局 为了整理CSSGridLayout的这套指南,我将介绍几种不同的布局,这些布局演示了在使用网格布局进行设计时可以使用的一些不同的技术。
CSSGridLayout:RealizingcommonlayoutsusingCSSGridLayout 为了完善CSSGridLayout的这套指南,我将介绍几种不同的布局,这些布局演示了在使用网格布局进行设计时可以使用的一些不同技术
Grid系统 Bootstrap包含了一个强大的移动优先的网格系统,它是基于一个12列的布局、有5种响应尺寸(对应不同的屏幕),支持Sassmixins自由调用,并结合自己预定义的CSS、Js类,用来创建各种形状和尺寸的布局
多媒体对象 | Media object
布局实用程序 为了加速移动友好和响应式开发,Bootstrap包含数十个实用工具类,用于显示,隐藏,对齐和分隔内容。
Grid栅格 概述 image.png 我们采用了24栅格系统,将区域进行24等分,这样可以轻松应对大部分布局问题。使用栅格系统进行网页布局,可以使页面排版美观、舒适。
Card 卡片
>iPad<pslot="content">iPad是由苹果公司于2010年开始发布的平板电脑系列,定位介于苹果的智能手机iPhone和笔记本电脑产品之间,(屏幕中有4个虚拟程序固定栏)与iPhone布局一样
Split 面板分割
Divider 分割线