📝 Bootstrap教程

418篇技术文档
  Bootstrap-网格演示

📅  最后修改于: 2020-10-27 04:06:12        🧑  作者: Mango

什么是网格?在图形设计中,网格是由一系列相交的直线(垂直,水平)线组成的结构(通常为二维),用于构造内容。它广泛用于印刷设计中的布局和内容结构设计。在网页设计中,使用HTML和CSS快速有效地创建一致的布局是一种非常有效的方法。Bootstrap网格系统的工作网格系统用于通过一系列容纳您的内容的行和列来创建页面布局。这是Bootstrap网格系统的工作方式-必须将行放置在.container类内,...

  Bootstrap-表演示

📅  最后修改于: 2020-10-27 04:06:26        🧑  作者: Mango

Bootstrap为构建表提供了干净的布局。 Bootstrap支持的一些表元素是-Sr.No.Tag & Description1<table>Wrapping element for displaying data in a tabular format2<thead>Container element for table header rows (<tr>) to label table c...

  Bootstrap-表单演示

📅  最后修改于: 2020-10-27 04:06:42        🧑  作者: Mango

表格布局Bootstrap为您提供以下类型的表单布局-垂直(默认)形式内联表格水平形式垂直或基本形式基本表单结构是Bootstrap附带的。单个表单控件会自动接收某些全局样式。要创建基本表单,请执行以下操作-将角色表单添加到父<form>元素。用类.form-group将标签和控件包装在<div>中。这是最佳间距所需的。向所有文本<input>,<textarea>和<select>元素添加.fo...

  Bootstrap-按钮演示

📅  最后修改于: 2020-10-27 04:06:58        🧑  作者: Mango

Bootstrap为样式按钮提供了一些选项,下表中对此进行了总结:Sr.No.Class & Description1btnDefault/ Standard button.2btn-primaryProvides extra visual weight and identifies the primary action in a set of buttons.3btn-successIndica...

  Bootstrap-图片演示

📅  最后修改于: 2020-10-27 04:07:12        🧑  作者: Mango

Bootstrap提供了三个类,可用于将一些简单样式应用于图像-.img-rounded-添加border-radius:6px给图像圆角。.img-circle-通过添加border-radius:500px使整个图像变圆。.img-thumbnail-添加一些填充和灰色边框:ExampleDescriptionDownload linkImage GalleryThis example ind...

  Bootstrap-响应式演示

📅  最后修改于: 2020-10-27 04:07:28        🧑  作者: Mango

Bootstrap提供了一些帮助程序类,以加快对移动设备的友好开发。这些可用于通过媒体查询,结合大型,小型和中型设备,按设备显示和隐藏内容。谨慎使用这些文件,并避免创建同一网站的完全不同的版本。响应实用程序当前仅可用于块和表切换。ClassesDevices.visible-xsExtra small (less than 768px)visible.visible-smSmall (up to ...

  Bootstrap-导航演示

📅  最后修改于: 2020-10-27 04:07:41        🧑  作者: Mango

Bootstrap为样式化导航元素提供了一些不同的选项。它们都共享相同的标记和基类.nav。 Bootstrap还提供了一个帮助程序类,以共享标记和状态。交换修饰符类可在每种样式之间切换。ExampleDescriptionDownload linkNavigation DemoThis example indicates about navigation structure in Bootstr...

  Bootstrap-博客演示

📅  最后修改于: 2020-10-27 04:07:54        🧑  作者: Mango

Bootstrap提供了几种样式化Blog的选项。博客元素包括评论框,博客文章,博客页脚等。ExampleDescriptionDownload linkComment Box DemoThis example indicates about Comment Box structure in BootstrapDownloadBlog Posts With ImagesThis example i...

  Bootstrap-材料设计演示

📅  最后修改于: 2020-10-27 04:08:07        🧑  作者: Mango

什么是材料设计材料设计是跨平台的视觉,运动和交互设计的综合指南ExampleDescriptionDownload linkMaterial box demoThis example indicates about Materiel card structure in Bootstrap.DownloadMaterial CardsThis example indicates about Mate...

  Bootstrap-滑块演示

📅  最后修改于: 2020-10-27 04:08:20        🧑  作者: Mango

Bootstrap提供了一些不同的样式来设置“导航”滑块的样式。一些示例如下所示-ExampleDescriptionDownload linkSlide menu on overThis example indicates about Slider Menu structure in BootstrapDownloadSub MenuThis example indicates about Sl...

  Bootstrap-时间线演示

📅  最后修改于: 2020-10-27 04:08:33        🧑  作者: Mango

Bootstrap提供了一些不同的时间线样式选项,如下所示-ExampleDescriptionDownload linkTimeline DemoThis example indicates about Time line structure in BootstrapdownloadSingle column Timeline dottedThis example indicates abou...

  Bootstrap-警报演示

📅  最后修改于: 2020-10-27 04:08:46        🧑  作者: Mango

警报提供了一种样式化给用户的消息。它们为典型的用户操作提供上下文反馈消息。一些警报示例,如下所示-ExampleDescriptionDownload linkPage alertsThis example indicates about Page Alert structure in BootstrapDownloadAlert MessagesThis example indicates ab...

  Bootstrap-管理界面演示

📅  最后修改于: 2020-10-27 04:09:00        🧑  作者: Mango

Bootstrap提供了几种用于管理界面样式的选项。一些管理界面如下所示-ExampleDescriptionDownload linkResponsive Mail Inbox and ComposeThis example indicates about Responsive Mail Inbox and Compose structure in BootstrapDownloadSimple...

  Bootstrap-Ajax演示

📅  最后修改于: 2020-10-27 04:09:12        🧑  作者: Mango

Ajax用于与网页和Web服务器通信。一些基于ajax和bootstrap的示例,如下所示-ExampleDescriptionDownload linkPayment FormThis example indicates about Ajax Payment Form in BootstrapDownloadAJAX / DIV WizardThis example indicates abou...

  Bootstrap-选项卡式滑块演示

📅  最后修改于: 2020-10-27 04:09:23        🧑  作者: Mango

Bootstrap为滑块提供了一些不同的选项。选项卡式滑块,如下所示-ExampleDescriptionDownload linkTabbed sliderThis example indicates about Tabbed Slider in BootstrapDownload...