初学——bootstrap
学习记录
cody_cat
这个作者很懒,什么都没留下…
展开
-
学习Bootstrap(八)——表单控件
一. 表单控件1-1 单行输入框(input)来自慕课网 常见的文本输入框,也就是input的type属性值为text。在Bootstrap中使用input时必须添加type类型,如果没有指定type类型,将无法得到正确的样式,因为Bootstrap框架都是通过input[type=“?”](其中?号代表type类型,比如说text类型,对应的是input[type=“text”])的形式来定义样原创 2017-12-28 18:03:49 · 825 阅读 · 0 评论 -
学习Bootstrap(七)——表单
表单来自慕课网 表单中常见的元素主要包括:文本输入框、下拉选择框、单选按钮、复选按钮、文本域和按钮等。其中每个控件所起的作用都各不相同,而且不同的浏览器对表单控件渲染的风格都各有不同。 ☑ LESS版本:对应源文件 forms.less ☑ Sass版本:对应源文件 _forms.scss 编译后的Bootstrap版本,可以查阅bootstrap.css文件第1630行~原创 2017-12-28 17:52:54 · 267 阅读 · 0 评论 -
学习Bootstrap(六)——表格
表格来自慕课网 表格是Bootstrap的一个基础组件之一,Bootstrap为表格提供了1种基础样式和4种附加样式以及1个支持响应式的表格。在使用Bootstrap的表格过程中,只需要添加对应的类名就可以得到不同的表格风格。bootstrap.css文件中第1402行~第1630行中可以查阅到所有有关于table的样式代码。Bootstrap为表格不同的样式风格提供了不同的类名,主要包括:☑原创 2017-12-28 17:30:32 · 5876 阅读 · 1 评论 -
学习Bootstrap(五)——代码
七. 代码显示来自慕课网在Bootstrap主要提供了三种代码风格,用户可以根据具体的需求来使用不同的类型: 1、<code>:一般是针对于单个单词或单个句子的代码 2、<pre>:一般是针对于多行代码(也就是成块的代码) 3、<kbd>:一般是表示用户要通过键盘输入的内容预编译版本的Bootstrap将代码的样式单独提取出来: 1、LESS版本,请查阅code.less文件 2、Sass原创 2017-12-28 16:25:03 · 343 阅读 · 0 评论 -
学习Bootstrap(四)——列表
六. 列表来自慕课网 在HTML文档中,列表结构主要有三种:有序列表、无序列表和自定义列表。 Bootstrap根据平时的使用情形提供了六种形式的列表:☑ 普通列表☑ 有序列表☑ 去点列表☑ 内联列表☑ 描述列表☑ 水平描述列表6-1. 无序列表,有序列表及列表嵌套ul,ol { margin-top: 0; margin-bottom: 10px;}ul ul,ol原创 2017-12-28 16:09:17 · 552 阅读 · 0 评论 -
学习Bootstrap(三)——文本,强调,对齐
三. 正文文本来自慕课网 Bootstrap中为文本设置了一个全局的文本样式(这里所说的文本是指正文文本):1、全局文本字号为14px(font-size)。2、行高为1.42857143(line-height),大约是20px(大家看到一串的小数或许会有疑惑,其实他是通过LESS编译器计算出来的,当然Sass也有这样的功能)。3、颜色为深灰色(#333);4、字体为”Helvetica Neu原创 2017-12-27 18:01:14 · 1333 阅读 · 1 评论 -
学习Bootstrap(二)——全局样式,标题
一. 全局样式Bootstrap框架并不一味追求归零,而是更注重重置可能产生问题的样式(如,body,form的margin等),保留和坚持部分浏览器的基础样式,解决部分潜在的问题,提升一些细节的体验,具体说明如下:移除body的margin声明 设置body的背景色为白色 为排版设置了基本的字体、字号和行高设置全局链接颜色,且当链接处于悬浮“:hover”状态时才会显示下划线样式styl原创 2017-12-27 17:42:57 · 669 阅读 · 0 评论 -
学习Bootstrap(一)——了解Bootstrap3
Bootstrap入门(一)学习版本:Bootstrap3 学习途径:慕课网简单强大的前端开发框架基于HTML5和CSS3放弃了IE7和Firefox3.x的支持,不太支持IE8,因为它对CSS3的支持不够下载包含css,js,fonts文件,其中js插件依赖于jQuery,所以要先引入jQueryBootstrap的HTML标准模板来自官网<!DOCTYPE html><html l原创 2017-12-27 17:15:20 · 288 阅读 · 0 评论