排版样式

2017-04-26  本文已影响0人  瑾瑜穆伟

#文本对齐

text-left

text-right

text-center

#块标签对齐

pull-left

pull-right

center-block

#一行三个图片时。想要中间图片隐藏,使用col-md-offset-4偏移4列

#h1→h6 class,给inline属性的文本赋予标题的样式

#副标题

small标签

#页面主体

#排版样式

h标签有个page-header类,可以在标题文字下加分割线,将标题与文本内容分开

p标签如果想要里面的文本内容更突出,即适当加大文字,使用lead类

strong和b标签加粗文字,建议使用strong

em和i标签是文字变成斜体,建议使用em

#强调class(文字颜色的强调,带有样式滑动效果,即加入了js特效)

text-muted:柔和色

text-primary:浅蓝色

text-success:深绿色

text-info:深蓝色

text-warning:棕色

text-danger:红色

鼠标在字体上滑动时,字体颜色会有微微变化

#缩略语

abbr标签,<abbr title=“你好”>哈哈</abbr>

当鼠标放在哈哈上时,出现你好

#默认样式的引用

<blockquote>标签表示文章的标题引用与来自哪(用于文章的排版)

#无序列表

ul标签的list-unstyled类去掉前面的点,去掉了padding和margin

ul标签的list-group类加上li标签的list-group-item类,实现每一行的特效,鼠标滑动时。出现块状的滑动

#菜单的制作

ul标签使用list-inline类,取消块特性,使用浮动

#自定义列表

<dl>

<dt></dt>

<dd></dd>

</dl>

风格已变动,无需家类名

dl的dl-horizontal类名,使dt和dd内容在一行

上一篇 下一篇

猜你喜欢

热点阅读