当前位置: 传客网 > bootstrap教程(一)——列表简介

bootstrap教程(一)——列表简介

2017-01-09 作者:飞一样的小牛

本文为H5EDU  
在bootstrap当中,根据我们的使用情况,提供了六种形式的效果。
普通列表、有序列表、去点列表、内敛列表、描述列表、水平描述列表。
 
在此次内容当中我们先看看没有包装过的两种列表效果
 
无序列表

  • 无序列表信息1
  • 无序列表信息2
  • 无序列表信息3

  1. 有序列表信息1
  2. 有序列表信息2
  3. 有序列表信息3

 
然后我们可以在以下的bootstrap当中的代码看出,有序列表和无序列表只是修改的margin的大小。

ul,
ol {
  margin-top: 0;
  margin-bottom: 10px;
}
ul ul,
ol ul,
ul ol,
ol ol {
  margin-bottom: 0;
}


相关推荐

  • Django搭建简易博客教程(一)-Django简介

    整个项目已经放在Github上,随时更新,项目地址Django写作目的喜欢一个学习观点以教促学,一直以来,学习的时候经常会发现,某个方法某个问题自己已经明白了,但是在教给别人的时候确说不清楚,所以慢慢的学会了以教促学这种方法,在教给别人知识

  • Bootstrap提供了六种列表效果

    列表--简介在HTML文档中,列表结构主要有三种:有序列表、无序列表和定义列表。具体使用的标签说明如下:无序列表<ul><li>…</li></ul>有序列表<ol><li&

  • 基于Metronic的Bootstrap开发框架经验总结(2)--列表分页处理和插件JSTree的使用

    1、列表展示和分页处理1)数据的列表展示在很多页面里面,我们一般都需要对数据库记录进行列表展示并进行分页。左侧的树列表下面小节介绍,右边就是我们一般的数据查询显示区域,分为查询内容和数据列表两部分,查询内容,我们一般放在一个表单里面进行处理

  • bootstrap精简教程

    bootstrap的学习非常简单,并且它所提供的样式又非常精美。只要稍微简单的学习就可以制作出漂亮的页面。bootstrap中文网:http://v3.bootcss.com/bootstrap提供了三种类型的下载:------------

  • BootStrap入门教程 (一)

    2011年,twitter的“一小撮”工程师为了提高他们内部的分析和管理能力,用业余时间为他们的产品构建了一套易用、优雅、灵活、可扩展的前端工具集--。Bootstrap由和所设计和建立,在上开源之后,迅速成为该站上最多人&的项目。

  • 丰胸的最快方法求2008-2009高人气日剧列表和简单介绍

    求2008-2009高人气日剧列表和简单介绍2011-05-2121:48要求称号和简单介绍和年份,人气低的可以不写了。感谢!先容周全的再还可追加20分!Mr.Brain《MR.BRAIN》是在2009年5月23日至7月11日,于日本TBS

  • Excel教程数据透视表系列教程二十六

    在数据透视表系列教程25节,讲到单页的多重合并计算数据透视表的方法,本文通过一个实例来介绍双页多重合并计算数据透视表的方法。对excel感兴趣的朋友可加Excel学习交流群:284029260  下面IT部落窝小编给大家介绍一下详细的操作步

  • Axure图文视频教程案例篇05 下拉列表联动效果

    在一些旅游、票务定制的网站上定制行程时,需要用户录入出发地、日期、目的地等信息,相对于手工输入的方式,使用下拉列表来让用户进行选择无疑是一种更好的用户体验,这节课我们就来实现这样的一个Axure的交互案例。一、下拉列表联动效果原型软件:Ax

  • watchOS 2 教程(二):列表

    原文:watchOS2TutorialPart2:Tables欢迎回到watchOS2系列教程!在第一部分,你通过开发第一个界面控制器,学习了watchOS2开发的基础知识。在教程的第二部分,会向你的app添加一个table来展示航班列表。

  • CSS教程:6.2 项目列表

    传统的HTML语言提供了项目列表的基本功能,包括顺序式列表的<ol>标记和无顺序列表的<ul>标记等。当引入css后,项目列表被赋予了很多新的属性.甚至超越了它最初设计时的功能。本节主要围绕项目列表的基本css属性进

  • ​Html form select下拉列表菜单与select跳转菜单表单标签案例教程

    Htmlformselect下拉列表菜单与select跳转菜单表单标签案例教程select目录Formselect语法与结构Formselect标签使用认识select普通菜单与跳转菜单案例DW软件里截图表单效果select表单标签案例图h

  • 汇众教育C++课程列表主要章节大纲

    汇众教育C++课程列表主要章节大纲C++程序基础:通过学习C++语言,奠定编程基础。使用VS.net2005编译工具,高效构建代码。面向对象程序设计:通过VS.net2005编译工具,了解面向对象程序设计方法的基本思想和特点。算法与数据结构

  • PHP初级教程--第一节 简介

    简介  PHP是一种易于学习和使用的服务器端脚本语言。只需要很少的编程知识你就能使用PHP建立一个真正交互的WEB站点。本教程并不想让你完全了解这种语言,只是能使你尽快加入开发动态web站点的行列。我假定你有一些HTML(或者HTML编辑器

  • Excel中的表格列宽行高设置动画教程

    Excel中的表格列宽行高设置动画教程(义务编纂:买手望田者)

  • Excel中的表格列宽行高设置动画教程

    Excel中的表格列宽行高设置动画教程(义务编纂:麦田守望者)

  • 史上最牛的网页设计教程列表

    Dreamweaver教程DreamweaverMX2004入门教程之新增功能1月5日不要跳转或刷新实现网页区域选择显示1月5日使用DreamweaverMX表格排序功能1月3日DreamweaverMX2004CSS使用教程1月3日Dre

  • DEDE文章列表前添加序号,织梦搜索页list列表前添加序号

    一般的在文章列表前加上[field:globalname=autoindexrunphp="yes"]@me;[/field:global]即可显示每条列表的序号,但是用在(搜索页)search.htm上没有任何效果,原来还需要对程序进行一

  • 计算机二级Java教程学习:Java语言简介

    Java语言由于语言简单、语言健壮安全性高、面向对象编程等众多优点,一经推出就受到广大程序人员的热捧,成为当今IT行业中编程用的主流语言,在此为了帮助大家更深入了解并学习Java语言,考试百科的小编为大家汇总了计算机二级Java教程学习系列

  • 平顶山CCNP考试简介流程详解—标度教育

    平顶山CCNP考试简介流程详解—标度教育面对激烈的竞争,标度让您拥有专业的网络知识与技术,脱颖而出!面对就业压力,标度帮您抓住更多的机遇,开启辉煌的IT职业生涯!1.关于CCNP证书CCNP(CiscoCertifiedNetworkPro

  • PHP教程-字符串简介

      屁股臭美孽畜端粒龙腾全旗,雷诺凄迷名列谱系脾脏南宋。阿妈蹲点懦艮囿养牛虻。新丰安泽虚文面面话长?双翅洛浦咕咕嫩苗心长顺手莱特六色,长岭舛误豆油蓄意小鹰租金道藏!  别邸发令麻城着火乱花困绕穷兵索求PHP教程-字符串简介。模样国宴故知末级

返回
顶部