zoukankan      html  css  js  c++  java
  • bootstrap-4

      html文档中,列表结构主要有三种:有序列表、无序列表和定义列表:<ul><li>、<ol><li>、<dl><dt><dd>

      bootstrap根据平时的使用情况提供了六种形式的列表:普通列表、有序列表、去点列表、内联列表、描述列表、水平描述列表

      列表----去点列表:列表(<ul>或者<ol>)中添加类名".list-unstyled",这样就可以去除默认的列表样式的风格

      列表----内联列表:通过添加类名".list-inline"来实现内联列表,简单点就是把垂直列表换成水平列表,而且去掉项目符号,保持水平显示。

      列表----定义列表:bootstrap只是调整了行间距,外边距和字体加粗效果。

      列表----水平定义列表:bootstrap可以给<dl>添加类名“.dl-horizaontal”给定义列表实现水平显示效果,详见608-621行

          此处添加了一个媒体查询,也就是说,只有屏幕大于678px的时候,添加类名".dl-horicaontal"才具有水平定义列表效果,其实现主要方式:

          1.将dt设置了一个左浮动,并且设置了一个宽度为160px

          2.将dd设置一个margin-left的值为180px,达到水平的效果

          3.当标题宽度超过160px时,将会显示三个省略号

  • 相关阅读:
    Mybatis详解(二)
    Mybatis详解(一)
    Java集合
    Java基础之IO
    Java异常知识点!
    HTTP状态码
    ajax传字符串时出现乱码问题的解决
    Json 文件 : 出现 Expected value at 1:0 问题的解决
    java @XmlTransient与@Transient区别
    文件的上传和回显
  • 原文地址:https://www.cnblogs.com/jodie-blog/p/5025989.html
Copyright © 2011-2022 走看看