-
- 撒满星星的森林夜 2021-10-21
- 移除body的margin声明
设置body的背景色为白色
为排版设置了基本的字体、字号和行高
设置全局链接颜色，且当链接处于悬浮“:hover”状态时才会显示下划线样式 - 0赞 · 0采集
-
- 你理理我 2021-10-09
- 在实际项目中，对于一些重要的文本，希望突出强调的部分都会做另外的样式处理。
- 0赞 · 0采集
-
- 你理理我 2021-10-09
- Bootstrap由MARK OTTO和Jacob Thornton所设计和建立，在github上开源之后，迅速成为该站上最多人watch&fork的项目。大量工程师踊跃为该项目贡献代码，社区惊人地活跃，代码版本进化非常快速，官方文档质量极其高(可以说是优雅)，同时涌现了许多基于Bootstrap建设的网站：界面清新、简洁;要素排版利落大方
- 0赞 · 0采集
-
- 你理理我 2021-10-09
- 我们在Web的制作中，常常会碰到在一个标题后面紧跟着一行小的副标题。在Bootstrap中他也考虑了这种排版效果，使用了<small>标签来制作副标题。这个副标题具有其自己的一些独特样式：
- 0赞 · 0采集
-
- 你理理我 2021-10-09
- 1、重新设置了margin-top和margin-bottom的值， h1~h3重置后的值都是20px；h4~h6重置后的值都是10px。
2、所有标题的行高都是1.1（也就是font-size的1.1倍）,而且文本颜色和字体都继承父元素的颜色和字体。
3、固定不同级别标题字体大小，h1=36px，h2=30px，h3=24px，h4=18px，h5=14px和h6=12px。 - 0赞 · 0采集
-
- 你理理我 2021-10-09
- 移除body的margin声明
设置body的背景色为白色
为排版设置了基本的字体、字号和行高
设置全局链接颜色，且当链接处于悬浮“:hover”状态时才会显示下划线样式 - 0赞 · 0采集
-
- 你理理我 2021-10-09
- bootstrap模板为使IE6、7、8版本（IE9以下版本）浏览器兼容html5新增的标签，引入下面代码文件即可。
- 0赞 · 0采集
-
- 你理理我 2021-10-09
- Bootstrap中JS插件依赖于jQuery因此jQuery要在Bootstrap之前引用
- 0赞 · 0采集
-
- 你理理我 2021-10-09
- bootStrap 是简洁强大的前端开发框架，前端工具集；
是简单、灵活的用于搭建web页面的HTML，CSS，JavaScript的工具集
它基于HTML5与CSS3，卓越的兼容性 - 0赞 · 0采集
-
- qq_慕仔5392732 2021-10-06
Bootstrap标题样式进行了以下显著的优化重置：
1、重新设置了margin-top和margin-bottom的值， h1~h3重置后的值都是20px；h4~h6重置后的值都是10px。
2、所有标题的行高都是1.1（也就是font-size的1.1倍）,而且文本颜色和字体都继承父元素的颜色和字体。
3、固定不同级别标题字体大小，h1=36px，h2=30px，h3=24px，h4=18px，h5=14px和h6=12px。- 0赞 · 0采集
-
- qq_慕仔5392732 2021-10-06
1.bootstrap不支持ie的兼容模式；(加入如下代码：<meta http-equiv="X-UA-Compatible" content="IE=edge">可在IE浏览器中运行最新的渲染模式)
2.初始化移动浏览器显示<meta name="viewport" content="width=device-width,initial-scale=1">(移动浏览器是把页面放在一个虚拟的视口中，即viewport，通常这个虚拟的视口比屏幕宽，这样就不用把每个网页挤到很小的视口中，但是这样会破坏没有针对移动浏览器优化的网页布局)（viewport可用于控制大小及缩放）（代码可理解为让视口的宽度为物理设备上真实的分辨率，即宽度，初始的缩放比例为1，即不缩放）
3.载入bootstrap的css样式，用link，如下图
若IE版本低于IE9，则加入图中代码http://img.mukewang.com/553b9b2f00018c0d12000530-120-68.jpg
4. 加入jQuery和js插件（bootstrap中的js插件依赖于jquery，因此jquery要在bootstrap之前引用。）
js文件放在body的最下面
html5shiv主要解决HTML5提出的新的元素不被IE6-8识别，这些新元素不能作为父节点包裹子元素，并且不能应用CSS样式。让CSS 样式应用在未知元素上只需执行 document.createElement(elementName) 即可实现。html5shiv就是根据这个原理创建的。
指定用户是否可以缩放视区，即缩放Web页面的视图。"是user-scalable指令 ,值为yes时允许用户进行缩放，值为no时不允许缩放。- 0赞 · 0采集
-
- weixin_慕无忌7365566 2021-09-08
Bootstrap拥有的组件样式，包括按钮、表格、标签、导航等。
- 0赞 · 0采集
-
- ColdSoul 2021-08-18
在IE运行最新的渲染模式
<meta http-equiv="X-UA-Compatible" content="IE=edge">
初始化移动窗口显示
<meta name="viewport" content="width=device-width,initial-scale=1">
- 0赞 · 0采集
-
- gsl003 2021-05-26
v2版本:支持广泛浏览器,因为兼容性包袱,本身功能不够激进,代码不够简洁(v2.3.2后不再跟新)
v3版本:放弃了IE7、火狐3.x版本的支持, 虽然支持Ie8,由于它对css3的支持有限,所以呈现效果也大打折扣
模版代码:
<!doctype html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <!--在IE运行最新的渲染模式--> <meta name="viewport" content="width=device-width, initial-scale=1"> <!--初始化移动浏览显示, 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ --> <title>Bootstrap 101 Template</title> <!-- Bootstrap --> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css" integrity="sha384-HSMxcRTRxnN+Bdg0JdbxYKrThecOKuH5zCYotlSAcp1+c8xmyTe9GYg1l9a69psu" crossorigin="anonymous"> <!-- HTML5 shim 和 Respond.js 是为了让 IE8 支持 HTML5 元素和媒体查询（media queries）功能 --> <!-- 警告：通过 file:// 协议（就是直接将 html 页面拖拽到浏览器中）访问页面时 Respond.js 不起作用 --> <!--[if lt IE 9]> <script src="https://cdn.jsdelivr.net/npm/html5shiv@3.7.3/dist/html5shiv.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/respond.js@1.4.2/dest/respond.min.js"></script> <![endif]--> </head> <body> <h1>你好，世界！</h1> <!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) --> <script src="https://cdn.jsdelivr.net/npm/jquery@1.12.4/dist/jquery.min.js" integrity="sha384-nvAa0+6Qg9clwYCGGPpDQLVpLNn0fRaROjHqs13t4Ggj3Ez50XnGQqc/r8MhnRDZ" crossorigin="anonymous"></script> <!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 --> <script src="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js" integrity="sha384-aJ21OjlMXNL5UyIl/XNwTMqvzeRMZH2w8c5cRVpzpU8Y5bApTppSuUkhZXN0VxHd" crossorigin="anonymous"></script> </body> </html>
- 0赞 · 0采集
-
- gsl003 2021-05-26
概念:简洁、灵活的用于搭建Web页面的HTML、CSS、JavaScript的工具集(简洁强大的前端开发框架,让web开发更迅速、更简单)
- 0赞 · 0采集
-
- 慕虎9101146 2021-03-25
胶囊形（pills）导航听起来有点别扭，因为其外形看起来有点像胶囊形状。但其更像我们平时看到的大众形导航。当前项高亮显示，并带有圆角效果。其实现方法和“nav-tabs”类似，同样的结构，只需要把类名“nav-tabs”换成“nav-pills”即可
- 0赞 · 0采集
-
- 慕虎9101146 2021-03-25
Bootstrap框架中制作导航条主要通过“.nav”样式。默认的“.nav”样式不提供默认的导航样式，必须附加另外一个样式才会有效，比如“nav-tabs”、“nav-pills”之类。
- 0赞 · 0采集
-
- 慕虎9101146 2021-03-25
在Bootstrap框架中的下拉菜单还提供了下拉分隔线，假设下拉菜单有两个组，那么组与组之间可以通过添加一个空的<li>，并且给这个<li>添加类名“divider”来实现添加下拉分隔线的功能。对应的样式代码：
- 0赞 · 0采集
-
- 慕虎9101146 2021-03-25
1、使用一个名为“dropdown”的容器包裹了整个下拉菜单元素，示例中为:
<div class="dropdown"></div>
2、使用了一个<button>按钮做为父菜单，并且定义类名“dropdown-toggle”和自定义“data-toggle”属性，且值必须和最外容器类名一致，此示例为:
data-toggle="dropdown"
3、下拉菜单项使用一个ul列表，并且定义一个类名为“dropdown-menu”，此示例为:
<ul class="dropdown-menu">
- 0赞 · 0采集
-
- 慕虎9101146 2021-03-24
1、不管是checkbox还是radio都使用label包起来了
2、checkbox连同label标签放置在一个名为“.checkbox”的容器内
3、radio连同label标签放置在一个名为“.radio”的容器内
在Bootstrap框架中，主要借助“.checkbox”和“.radio”样式，来处理复选框、单选按钮与标签的对齐方式。- 0赞 · 0采集
-
- 慕虎9101146 2021-03-24
有时候为了让表格更具阅读性，需要将表格制作成类似于斑马线的效果。简单点说就是让表格带有背景条纹效果。在Bootstrap中实现这种表格效果并不困难，只需要在<table class="table">的基础上增加类名“.table-striped”即可
- 0赞 · 0采集
-
- 慕虎9101146 2021-03-23
Bootstrap为表格不同的样式风格提供了不同的类名，主要包括：
.table：基础表格
.table-striped：斑马线表格
.table-bordered：带边框的表格
.table-hover：鼠标悬停高亮的表格
.table-condensed：紧凑型表格
.table-responsive：响应式表格
- 0赞 · 0采集
-
- 慕虎9101146 2021-03-23
只需要在pre标签上添加类名“.pre-scrollable”，就可以控制代码块区域最大高度为340px，一旦超出这个高度，就会在Y轴出现滚动条。
- 0赞 · 0采集
-
- 慕虎9101146 2021-03-23
Bootstrap可以给<dl>添加类名“.dl-horizontal”给定义列表实现水平显示效果。
- 0赞 · 0采集
-
- 慕虎9101146 2021-03-23
通过添加类名“.list-inline”来实现内联列表，简单点说就是把垂直列表换成水平列表，而且去掉项目符号（编号），保持水平显示。
- 0赞 · 0采集
-
- 慕虎9101146 2021-03-23
通过给无序列表添加一个类名“.list-unstyled”,这样就可以去除默认的列表样式的风格。
- 0赞 · 0采集
-
- 慕虎9101146 2021-03-23
.text-justify：两端对齐
- 0赞 · 0采集
-
- 慕神5481088 2021-02-28
- 值得注意的是dd标签内可以添加任意其他标签，但是dt标签内不能添加块级标签只能添加行级或行内块级标签。
- 0赞 · 0采集
-
- 慕神5481088 2021-02-28
- 无序列表距离页面左侧有一定的间距，且项目前用实心点表示； 有序列表距离页面左侧也有一定的间距，且项目前用数字表示； 定义列表距离页面左侧没有间距，且项目前没有任何符号或标记
- 0赞 · 0采集
-
- 慕神5481088 2021-02-28
- < i > 是视觉要素（presentationl elements），分别表示无意义的加粗，无意义的斜体，仅仅表示样式上是粗体或斜体，而没有强调的语义，这两个标签在HTML4.01中不推荐使用，建议用CSS样式； < em > 是表达要素(phrase elements)。 < em > （emphasized text）表示一般的强调文本，这个标签具有语义。该标签中的内容在搜索引擎中更受重视,一些语音阅读器也会根据它在阅读时加强语气。
- 0赞 · 0采集
