学习内容

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了学习内容相关的知识,希望对你有一定的参考价值。

      这段时间学习了字体图标,按钮组,下拉菜单,模态框等一些常用的组件。

     下拉菜单,要有一个下拉的效果,一个Dropdown按钮和右侧有个小图标caret,这个小图标和按钮的文本是平级的。

button按钮中有个dropdown-tooggle,还有一个data-toggle属性,根据这个属性来弹出下拉列表。

然后接着ul标签的dropdown-menu是和上面button按钮的样式类dropdown-toggle联合使用,在通过aria-labelledby绑定

上面的button按钮。示例代码:

<div class="dropdown">
  <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-expanded="true">
    Dropdown
    <span class="caret"></span>
  </button>
  <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
    <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Action</a></li>
    <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Another action</a></li>
    <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Something else here</a></li>
    <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Separated link</a></li>
  </ul>
</div>

     字体图标,图标类不能和其它组件直接联合使用。它们不能在同一个元素上与其他类共同存在。应该创建一个嵌套的 <span>标签,并将图标类应用到这个 <span> 标签上。

图标类只能应用在不包含任何文本内容或子元素的元素上。

  也可以把它们应用到按钮、工具条中的按钮组、导航或输入框等地方。示例代码:

<button type="button" class="btn btn-default" aria-label="Left Align">
  <span class="glyphicon glyphicon-align-left" aria-hidden="true"></span>
</button>

<button type="button" class="btn btn-default btn-lg">
  <span class="glyphicon glyphicon-star" aria-hidden="true"></span> Star
</button>

  

以上是关于学习内容的主要内容,如果未能解决你的问题,请参考以下文章

C语言100个经典算法源码片段

[原创]java WEB学习笔记61:Struts2学习之路--通用标签 property,uri,param,set,push,if-else,itertor,sort,date,a标签等(代码片段

IOS开发-OC学习-常用功能代码片段整理

java SpringRetry学习的代码片段

python 机器学习有用的代码片段

学习笔记:python3,代码片段(2017)