Bootstrap常用属性含义

容器类

container类用于固定宽度并支持响应布局的容器(两边留空白)
container-fluid类用于100%宽度，占据全部视窗的容器

网格类

col :针对所有设备
sm:平板-屏幕宽度等于或大于576px
md:中等屏幕（>=768px）
lg:大屏幕，桌面显示器（>=992px）
xl:超大桌面显示器（>=1200px）
offset：偏移列

<div class="col">.col</div>
<div class="col-sm-3">.col-sm-3</div>

row：行，相当于tr

文字

font-size:字体大小
line-height: 行高
font-family：默认字体
h1-h6:标题大小
Disolay:控制标题样式
small:创建字号更小颜色更浅的文本
mark:为黄色背景及有一定的内边距（高亮文本）
abbr:显示在文本底部的一条虚线边框(似标记文本）
font-weight-bold:加粗文本
font-weight-normal：普通文本
font-weight-light：更细文本
font-italic：斜体文本
lead：让段落更突出
text-left：左对齐
text-center：居中
text-right：右对齐
text-justify：设定文本对齐,段落中超出屏幕部分文字自动换行
text-nowrap：超出屏幕不换行

文本颜色

text-muted：柔和文本（很淡的灰）
text-primary：重要文本（蓝色）
text-success：执行成功的文本（绿色）
text-info：提示信息（很淡的蓝）
text-warning：警告文本（黄色）
text-danger：危险文本（红色）
text-dark：深灰色文字
text-light：浅灰色文本
text-white:白色文本

背景颜色

bg-primary text-white：重要背景颜色（蓝色）
bg-success text-white：成功背景颜色（绿色）
bg-info text-white：信息提示背景颜色（青色）
bg-warning text-white：警告背景颜色（黄色）
bg-danger text-white：危险背景（红色）
bg-dark text-white：深灰色
bg-light text-dark：浅灰色

表格

table：设置基础表格样式
table-striped：条纹表格
table-bordered：带边框的表格
table-hover：鼠标悬停状态表格（鼠标在哪个哪个高亮）
table-responsive:响应式表格，当屏幕较小的时候会出现滚动条
注：若要设置表格颜色基本和设置文本颜色一样：eg:table-primary

图像形状

rounded：圆角图片
rounded-circle：椭圆图片
img-thumbnail：缩略图（有边框）

<!--图片：-->
<!--class="img-responsive"：图片在任意尺寸都占100%-->
<!--图片形状-->
<!--方形：-->
<img src="..." alt="..." class="img-rounded">
<!--： 圆形-->
<img src="..." alt="..." class="img-circle">
<!--：相框-->
<!--alt:是图片无法加载的时候默认加载的图片-->
<img src="..." alt="..." class="img-thumbnail">

图片对齐方式

float-right ：右对齐
float-left：左对齐
center-block：居中

其它

pull-left：元素浮动到左边
pull-right：元素浮动到右边
clearfix：清除浮动
show：强制元素显示
hidden：强制元素隐藏
按钮：class=“btn btn-default”

HTML常用标签

 文件标签：构成html最基本的标签head：头标签。用于指定html文档的一些属性。引入外部的资源title：标题标签。body：内容标签文本标签：和文本有关的标签注释：<!-- 注释内容 --><h1> to <h6>：标题标签h1~h6:字体大小逐渐递减<p>：段落标签<br>：换行标签<hr>：展示一条水平线属性：color：颜色width：宽度size：高度align：对其方式center：居中left：左对齐right：右对齐<b>：字体加粗<i>：字体斜体<font>:字体标签<center>:文本居中属性：color：颜色size：大小face：字体属性定义：color：1. 英文单词：red,green,blue2. rgb(值1，值2，值3)：值的范围：0~255  如  rgb(0,0,255)3. #值1值2值3：值的范围：00~FF之间。如： #FF00FFwidth：1. 数值：width='20' ,数值的单位，默认是 px(像素)2. 数值%：占比相对于父元素的比例图片标签：img：展示图片属性：src：指定图片的位置代码：<!--展示一张图片 img--><img src="data:image/jingxuan_2.jpg" align="right" alt="古镇" width="500" height="500"/><!--相对路径以.开头的路径./：代表当前目录  ./image/1.jpg../:代表上一级目录--><img src="./image/jiangwai_1.jpg"><img src="../image/jiangwai_1.jpg">列表标签：有序列表：ol:li:无序列表：ul:li:链接标签：a:定义一个超链接属性：href：指定访问资源的URL(统一资源定位符)target：指定打开资源的方式_self:默认值，在当前页面打开_blank：在空白页面打开代码：<!--超链接  a--><a href="http://www.itcast.cn">点我</a><a href="http://www.itcast.cn" target="_self">点我</a>div和span：div:每一个div占满一整行。块级标签span：文本信息在一行展示，行内标签 内联标签语义化标签：html5中为了提高程序的可读性，提供了一些标签。<header>：页眉<footer>：页脚表格标签：table：定义表格width：宽度border：边框cellpadding：定义内容和单元格的距离cellspacing：定义单元格之间的距离。如果指定为0，则单元格的线会合为一条、bgcolor：背景色align：对齐方式tr：定义行bgcolor：背景色align：对齐方式td：定义单元格colspan：合并列rowspan：合并行th：定义表头单元格<caption>：表格标题<thead>：表示表格的头部分<tbody>：表示表格的体部分<tfoot>：表示表格的脚部分

CSS

 表单项标签：input：可以通过type属性值，改变元素展示的样式type属性：text：文本输入框，默认值placeholder：指定输入框的提示信息，当输入框的内容发生变化，会自动清空提示信息   password：密码输入框radio:单选框注意：1. 要想让多个单选框实现单选的效果，则多个单选框的name属性值必须一样。2. 一般会给每一个单选框提供value属性，指定其被选中后提交的值3. checked属性，可以指定默认值checkbox：复选框注意：1. 一般会给每一个单选框提供value属性，指定其被选中后提交的值2. checked属性，可以指定默认值file：文件选择框hidden：隐藏域，用于提交一些信息。按钮：submit：提交按钮。可以提交表单button：普通按钮image：图片提交按钮src属性指定图片的路径   label：指定输入项的文字描述信息注意：label的for属性一般会和 input 的 id属性值 对应。如果对应了，则点击label区域，会让input输入框获取焦点。select: 下拉列表子元素：option，指定列表项textarea：文本域cols：指定列数，每一行有多少个字符rows：默认多少行//常见属性font-size：字体大小color：文本颜色text-align：对其方式line-height：行高 background：背景border：设置边框，符合属性margin：外边距padding：内边距默认情况下内边距会影响整个盒子的大小box-sizing: border-box;  设置盒子的属性，让width和height就是最终盒子的大小

Bootstrap常用属性含义相关推荐

Android中ImageView常用属性含义
android:layout_above="@id/xxx" --将控件置于给定ID控件之上 android:layout_below="@id/xxx" -- ...
info.plist文件常用属性含义
Localization native development region : 与本地化设置有关,为默认的开发语言 Executable file:程序安装包的名称 Bundle identifie ...
Bootstrap常用布局样式
Bootstrap常用布局样式 1 内容布局 1.1 标题类 1.2 文本类 1.3 列表类 2 代码和图文布局 2.1 代码样式 2.2 图文样式 3 表格布局 4 辅助样式 4.1 添加或移除边框 ...
C#控件及常用属性整理
C#控件一览表前所未有的震撼(太详细了) 1.窗体 1.常用属性 (1)Name属性:用来获取或设置窗体的名称,在应用程序中可通过Name属性来引用窗体. (2) WindowState属性: 用来 ...
SCSS--SCSS 常用属性合集
SCSS相关介绍 SCSS官方文档文章目录 1. 常用属性合集和 1.1 规则嵌套 1.2 父选择器 1.3 嵌套属性 1.4 变量 $ (variables: $) 1.5 运算 1.6 变量定义 ...
Delphi常用属性
常用[属性] Action:该属性是与组件关联的行为,允许应用程序集中响应用户命令 Anchors:与组件连接的窗体的位置点 Align:确定组件的对齐方式 AutoSize:确定组件是否自动调整其大 ...
android edittext控件常用属性,Android_Android EditText常用属性功能汇总，本文总结分析了Android EditText常 - phpStudy...
Android EditText常用属性功能汇总本文总结分析了Android EditText常用属性.分享给大家供大家参考,具体如下: android:hint="请输入数字!" ...
selenium提取数据之driver对象的常用属性和方法
selenium提取数据之driver对象的常用属性和方法在使用selenium过程中,实例化driver对象后,driver对象有一些常用的属性和方法 driver.page_source 当前标 ...
尚硅谷学习笔记-节点的常用属性和方法
节点的常用属性和方法[图片在末尾] 方法: 通过具体的元素节点调用 getElementsByTagName() 方法,获取当前节点的指定标签名孩子节点 appendChild( oChildNode ...

Bootstrap常用属性含义

容器类

网格类

文字

文本颜色

背景颜色

表格

图像形状

导航

其它

HTML常用标签

CSS

Bootstrap常用属性含义相关推荐

最新文章

热门文章