Bootstrap
wendZzz
若有需要请联系微信号:coolbigflower
微信公众号:前端一起学
展开
-
Bootstrap-开始使用
在校期间就接触过Bootstrap,但一直没有好好研究,最初连如何使用Bootstrap都是一头雾水。这篇文章就详细的介绍Bootstrap的下载与引用。1、下载Bootstrap百度搜索Bootstrap就可以了,英文水平不错的可以去官网浏览,渣渣呢(我)就去Bootstrap中文网就好了。点击中文文档之后呢就可以进入下载界面,一般下载第一个“用于生产环境的Bootstr...原创 2018-09-11 11:55:32 · 313 阅读 · 0 评论 -
Bootstrap-排版样式
一、页面排版Bootstrap 提供了一些常规设计好的页面排版的样式供开发者使用(设置不同class名即可获取不同样式)。1、页面主体 Bootstrap 将全局font-size 设置为14px line-height 行高设置为1.428(即20px) <p>段落元素被设置等于1/2 行高(即10px) ...原创 2018-09-11 10:41:50 · 641 阅读 · 0 评论 -
bootstrap-列表样式
ul,ol变化不大,只修改了margin值<ul> <li>你瞅啥</li> <li>瞅你咋地</li></ul> 底部有个20px的边距,顶部么有 。<ol> <li>你瞅啥</li> <li>瞅你咋地</li>...原创 2018-12-21 08:57:42 · 4316 阅读 · 0 评论 -
bootstrap-文档中代码显示
显示代码的三种风格:使用<code></code>来显示单行内联代码 使用<pre></pre>来显示多行块代码 使用<kbd></kbd>来显示用户输入代码code<p>你玩过QQ飞车吗?按住<code>Shift</code>键释放氮气&a原创 2018-12-21 09:03:21 · 480 阅读 · 0 评论 -
bootstrap-表格样式
不同的样式风格提供了不同的类名,主要包括:.table:基础表格 .table-striped:斑马线表格 .table-bordered:带边框的表格 .table-hover:鼠标悬停高亮的表格 .table-condensed:紧凑型表格 .table-responsive:响应式表格tr,不同类名不同颜色<table class="table table-bor...原创 2018-12-21 09:09:21 · 753 阅读 · 0 评论 -
bootstrap-表单样式
水平表单<form class="form-horizontal" role="form"> <div class="form-group"> <label for="inputEmail" class="col-sm-2 control-label">邮箱</label&g原创 2018-12-21 09:12:29 · 1353 阅读 · 0 评论 -
bootstrap-表单控件
表单控件还是嵌入在表单格式中使用输入框<input type="email" class="form-control" placeholder="Enter email">下拉选择框<select class="form-control" style="width: 333px;"> <!--多行选择 增加一个属原创 2018-12-21 09:18:30 · 333 阅读 · 0 评论 -
Bootstrap-标题样式
Bootstrap重新设置了margin-top和margin-bottom的值,h1~h3重置后的值都是20px;h4~h6重置后的值都是10px。所有标题的行高都是1.1(也就是font-size的1.1倍),而且文本颜色和字体都继承父元素的颜色和字体。固定不同级别标题字体大小,h1=36px,h2=30px,h3=24px,h4=18px,h5=14px,h6=12p...原创 2018-12-18 16:33:48 · 1415 阅读 · 0 评论 -
Bootstrap-文本样式
全局的文本样式 <p>全局文本字号为14px(font-size);<br>行高为1.42857143(line-height),大约是20px;<br>颜色为深灰色(#333);<br>字体为"Helvetica Neue", Helvetica, Arial, sans-serif;<br>默认情况之下,p元素具有一个上...原创 2018-12-18 16:38:53 · 2105 阅读 · 0 评论