Bootstrap组件学习手记
需积分: 3 124 浏览量
2017-01-06
23:25:57
上传
评论
收藏 38KB DOCX 举报
组件学习日记
使用的是 Mozilla Firefox 50.1 浏览器
1.图标字体的使用
主要在 标签中使用。我基本上试了几个字体图标，发现只有前 个可以显示出来，
其他的显示成这样 ，不知道是我使用方法不对，还是你们使用也是这样。如果知道原
因，多多指教。
2.下拉菜单
下 拉 菜 单 中 的 下 拉 部 分 默 认 是 不 会 显 示 的 ， 因 为 在 中 ， 它 将
“设置了：“所以当我们改为“：就会显示了。但
一般我们是不在 中做改变的，而是根据个人需要另外添加样式。例如，我们
可以在 里添加：
.dropdown:hover ul{
display:block;
}
当然这是我自己加的。你也可以添加也别的。除此之外，还可以在“的 的
里再加一个“就可以显示了。
下拉菜单的对齐。由于“是块状元素，默认下宽度是 的，也就是占
满屏幕，所以添加上“!后，下拉菜单会在屏幕的最右边。此时，只要
给“设置一下宽度就可以解决。同样是另外自己添加样式。例如：
.dropdown{
width:250px;
}
说到这里，想起了一个关于下拉菜单的问题，也是我曾经遇到的，也是容易忽视的。
就是下拉菜单显示不出来，而且也设置了“为什么呢？那可能就是你在下拉菜
单的父元素里设置了“"。可能你原本的意思是清除掉浮动，但后来就自然影
响了下拉菜单的显示。这种情况经常发生在做导航的时候。虽然问题小，但还请大家注意。
后面所说的一些更改，都是另外添加，不要在原 更改，后面就不再重复
赘述。
#标题就没有什么可说的，也没有什么问题，复制粘贴就可以使用。
$ 分割线。如果大家想添加分割线，不要在原有的 上添加“ %&%'
，这样你会发现原有的 里面的内容没有了，而是变成了一条分割线。为什么呢？其实不
是内容没有了，而是 在“里将 的高度度设置了 (。所以大家想添加分
割线，就重新添加一个空白的 ，并为此添加上“&就可以了。这样你想有几条
分割线，想在哪个位置加，就在那个位置写个 就行。
)禁用的菜单项，你一学就会，直接过吧！
3.按钮组
如果单单只有按钮好像没什么意思，但是按钮和下拉菜单的组合，挺有趣的。
#嵌套和垂直排列差不多，只是“不同的壳但却包着相同蛋黄”。开个玩笑，不然太枯
燥了。
#两段对齐排列的按钮组除了*+元素和*,+元素外，其实也可以写成下面这样：
资源评论
