BootSrap基础--列表与定义列表

对于列表而言,bootStrap没有做太多的调整,只是调整了行边距(margin-left)、外边距以及字体加粗,

BootSrap基础--列表与定义列表_第1张图片

 标签的定义 

源码如下:


BootSrap基础--列表与定义列表_第2张图片

标签的使用

docuement Title

内容

显示:

此处要注意加上bootstrap的css文件


BootSrap基础--列表与定义列表_第3张图片
效果图

但是往往我们会希望网页的宽度小于768px的时候,是换行,大于768的时候是在同一行的

此时的标题是是垂直的,如果是对平的话,应该再次添加class

class="dl-horizontal"



BootSrap基础--列表与定义列表_第4张图片
源代码



效果图: 

BootSrap基础--列表与定义列表_第5张图片


如果网页的宽度小于160px的时候会放在第二行 如下图所示







此处推荐一个前端的利器:


BootSrap基础--列表与定义列表_第6张图片
感谢当年为我推荐这个工具的女神 ;)



BootSrap基础--列表与定义列表_第7张图片


下面重点讲解一下bootstrap中的这些语句:

你可能感兴趣的:(BootSrap基础--列表与定义列表)