选择器

根据选择器来对html内的内容做css修饰

样式:

找到一个元素{

样式:值;

}

找到一个元素:选择器

css都在style标签内部写

1.标签选择器:

根据标签名查找。

小丽:

  

2.id选择器

id必须是唯一的。css修饰是用#开头

3.class选择器,

可以选择多个元素,加到多个标签里面,css修饰.开头

优先级:id > class > 标签

下面开始学习Bootstrap

可以把这个bootstrap.css文件直接下载下来,我们来应用,也可以应用他们给提供的链接。

复制其链接的方式:

<head>
<meta charset="UTF-8">
<title>hello world</title>
<link rel="stylesheet" href=" url .....">
</head>
css的链接填写到此处。

把bootstrap.css下载下来的方式:

后面有需要css来装饰的,直接类似如上引用就可以了。

继续学习:

1、容器:container

这种是铺满整个背景的。

如果去掉fluid,就不居中覆盖。

2、一行 row

3、列, 用 col-md-数字,来控制占得宽度,bootstrap,模式是把屏幕分成12分,可以分别得对齐控制

来看看代码是如何控制的。

放到一个容器里,然后分行来对齐进行设置

结果如下:

4、列偏移

在一行上,以4列为一个单位,然后向右偏移4列,然后对第二个4列作为一行,然后再分为三分。

对table进行操作

对table的操作,bootstrap还有其他的样式,如果想用可以在方框处引用就可以了。

bootstrap中集中颜色的定义

Html + Css 小知识点的更多相关文章

  1. js,css小知识点记录

    JS手册中提到:可以使用任意表达式作比较表达式.任何值为0.null.未定义或空字符串的表达式被解释为 false.其他任意值的表达式解释为 true.也就是说,这里会隐式的转换为布尔值.       ...

  2. css小知识点

    1.div如何让背景是透明的 如:<div class="ha"></div> <style> .ha{ background:transpar ...

  3. 关于web前端中遇到的html,css小知识点

    容器溢出: 语法:overflow: visible | hidden | scroll | auto | inherit; visible:默认值,溢出内容不会被裁剪,正常显示 hidden: 溢出 ...

  4. css 小知识点:inline/inline-block/line-height

    inline: 此元素会被显示为内联元素,元素前后没有换行符.因此:无法设置宽度和高度- inline-block: 行内块元素.元素前后没有换行符(CSS2.1 新增的值) 用通俗的话讲,就是不独占 ...

  5. 图片文字css小知识点

    行内元素,图片和文字中间有缝隙,需要给父元素设置font-size:0: 图片和文字不对齐,给图片设置vertical-align:top 文字行高有缝隙 设置vertical-align:top  

  6. css 小知识点

    苹果浏览默认表单 单选 多选 下拉列表 效果的去除 提交按钮-webkit-appearance: none;-moz-appearance: none;-ms-appearance: none;ap ...

  7. CSS小知识点一

    1.   text-indent属性    缩进文本 通过使用 text-indent 属性,所有元素的第一行都可以缩进一个给定的长度,甚至该长度可以是负值.这个属性最常见的用途是将段落的首行缩进,一 ...

  8. 【转】HTML5的小知识点小集合

    html5的小知识点小集合 html5知识   1.  Doctype作用?标准模式与兼容模式各有什么区别? (1).<!DOCTYPE>声明位于位于HTML文档中的第一行,处于<h ...

  9. html5的小知识点小集合

      html5的小知识点小集合 html5知识   1.  Doctype作用?标准模式与兼容模式各有什么区别? (1).<!DOCTYPE>声明位于位于HTML文档中的第一行,处于< ...

随机推荐

  1. [已读]你不知道的JavaScript(上卷)

    就在前幾天,我在看完第一部分的時候,說它在我心中要超過蝴蝶書了,好吧,現在要收回這句話.第二部分的內容著重在ecma5,6對象的新特性的介紹,深度上就一般啦,沒什麼收穫.總體來說,這本書詞法作用域,作 ...

  2. Mysql5.7免编译版自动安装脚本

    一:readme: .此脚本仅仅适合于5.7免面编译安装版本. .安装是需自己选择mysql软件安装包:例如mysql--linux-glibc2.-x86_64.-linux-glibc2.-x86 ...

  3. ES-Mac OS环境搭建-kibana

    简介 Kibana是一个为ElasticSearch 提供的数据分析的 Web 接口.可使用它对日志进行高效的搜索.可视化.分析等各种操作. 下载 打开elasticseach官网,单击downloa ...

  4. 除虫记——有关WindowsAPI文件查找函数的一次压力测试

    作者:朱金灿 来源:http://blog.csdn.net/clever101 这里说的除虫是指排除bug的意思.今天排除了一个有意思的bug,其中的场景大致是这样的:现在你要统计一个文件夹下非隐藏 ...

  5. Java文件操作系列[1]——PDFBox实现分页提取PDF文本

    需求:用java分页提取PDF文本. PDFBox是一个很好的可以满足上述需求的开源工具. 1.PDF文档结构 要解析PDF文本,我们首先要了解PDF文件的结构. 关于PDF文档,最重要的几点: 一, ...

  6. k8s 如何 Failover?

    上一节我们有 3 个 nginx 副本分别运行在 k8s-node1 和 k8s-node2 上.现在模拟 k8s-node2 故障,关闭该节点. 等待一段时间,Kubernetes 会检查到 k8s ...

  7. selenium-元素的定位

    前戏 元素的定位是自动化测试的核心,要想操作一个元素,首先应该识别这个元素.Webdriver 提供了一系列的元素定位方法,常用的有 id,name,class name,link text,part ...

  8. java中regex参考

    在Sun的Java JDK 1.40版本中,Java自带了支持正则表达式的包,本文就抛砖引玉地介绍了如何使用java.util.regex包. 可粗略估计一下,除了偶尔用Linux的外,其他Linu ...

  9. prototype中的ajax异步加载

    jquery前台处理: var param = {a:a}; $.post("*.do",param,function(data) { var columHtml = " ...

  10. 实现类似AOP的封装和配置

    这是张孝祥老师Java进阶讲解中最后一个视频,就是实现类似spring中的AOP的封装和配置,特别特别小型的一个框架雏形,但是spring中的核心思想还是体现出来了,真的厉害,张老师!!! 一.重点知 ...