<style type="text/css">

* { padding:0; margin:0; }

.box h2 {

  //内边距左边的距离
  padding-left:10px;

  //内边距左边的距离
  padding-right:10px;

  //边框有无、宽度和颜色

  border: 1px solid #000;

  //背景的高度
  height:100px;

  //背景的宽度
  width: 100px;

  //背景颜色
  background:#87b0e1;
  line-height:30px;

  //文字的颜色
  color:#fff;

  //文字的大小
  font-size:14px;

  //文字左右对其,可以使得div横向排列
  float:left;

  //去掉a标签的下划线

  text-decoration: none;

  //在ul里面写去掉li前面的小圆点

  list-style-type: none;

  //relative定位的时候使用width会影响上一级元素的width,把上一级元素的宽度撑大,absolute不会

    在a{}中使用width是文本的宽度,在ul中使用时ul的宽度,即是所有li的宽度的和

    在a{}中使用width要使用display:block

  position:relative和absolute

  //h1标签的默认大小为200%

  //h2标签的默认大小为150%

  //h3标签的默认大小为115%

  //使用text-align对容器内的容器进行居中的时候,需要在内部容器中的文字的属性上加上display:none,否则不能居中,比如<p><a href="#">菜 单</a></p>,

  需要在.box p a的属性中加上display:none和text-align:center

  //在给内部的a标签加上了width和height之后,居中的效果将失效,要再加上margin:0 auto才能使得居中的效果再次显示出来

  //图像的左侧和右侧均不允许出现浮动元素:

  //使用clear:both

  

  //设置元素的位置坐标的时候要修改position:absolute,否则修改坐标位置不发生改变

  //使用jquery的show()方法的时候,要先在css中加上display:none;才能使用.show("fast");

  //给label设置了宽度后,想要使得label的内容在这一宽度范围中向右对其,要写float:left;text-align:right;

  //使用top=0;left=o;right=0;bottom=0;margin=auto;positon:absolute;来使得元素在页面中处于中心

}
</style>

CSS学习笔记——CSS选择器样式总结的更多相关文章

  1. CSS学习笔记之选择器

    目录 1.元素选择器 2.继承 3.选择器分组 4.声明分组 5.后代选择器 6.子元素选择器 7.相邻兄弟选择器 8.类选择器 9.ID 选择器 10.属性选择器 11.伪类 12.伪元素 1.元素 ...

  2. CSS学习笔记(1):选择器

    一.元素选择器 HTML文档元素就是最基本的选择器 如: <!DOCTYPE html> <html lang="en"> <head> < ...

  3. Html和Css学习笔记-css进阶-盒模型

    我的邮箱地址:zytrenren@163.com欢迎大家交流学习纠错! 此篇博客是我的复习笔记,html和css学的时间太久了,忘得差不多了,最近要使用一下,所以重新打开html的书略读,后记录了标签 ...

  4. Html和Css学习笔记-css基础知识

    我的邮箱地址:zytrenren@163.com欢迎大家交流学习纠错! 此篇博客是我的复习笔记,html和css学的时间太久了,忘得差不多了,最近要使用一下,所以重新打开html的书略读,后记录了标签 ...

  5. CSS 学习笔记——CSS Selector

    CSS1 中定义的选择器 类型选择器 用于选择指定类型的元素(其实他就是 html 标签选择器),常见用法如下: body { /*对 body 元素定义样式*/ } body,div { /*同时选 ...

  6. CSS学习笔记——CSS中定位的浮动float

    昨天在解决了盒模型的问题之后又出现了新的知识模糊点:浮动和绝对定位?今天先解决浮动相关的问题,首先列举出想要解决的问题: 1.浮动到底是怎么样的? 2.浮动对元素的影响有什么? 3.浮动主要用来干什么 ...

  7. CSS学习笔记之基本介绍

    1.简介 层叠样式表(Cascading Style Sheets,CSS)允许我们把样式设置存储在文件中,从而将内容与表现分离 当同一个 HTML 元素被不只一个样式定义时,最终的样式确定顺序如下( ...

  8. HTML+CSS学习笔记 (7) - CSS样式基本知识

    HTML+CSS学习笔记 (7) - CSS样式基本知识 内联式css样式,直接写在现有的HTML标签中 CSS样式可以写在哪些地方呢?从CSS 样式代码插入的形式来看基本可以分为以下3种:内联式.嵌 ...

  9. CSS学习笔记之样式声明

    目录 1.背景 2.文本 3.字体 4.列表 5.表格 6.轮廓 在这篇文章中你能看到有关于 CSS 样式设置的常用属性,文章的目录如下: 1.背景 (1)背景颜色 可以使用 background-c ...

随机推荐

  1. [转]理解RESTful架构

    原文地址:http://www.ruanyifeng.com/blog/2011/09/restful 越来越多的人开始意识到,网站即软件,而且是一种新型的软件. 这种"互联网软件" ...

  2. MyBatis_Generator的使用(实践)

    使用MyBatis的Generator主要配置三个地方 1.pom.xml 2.generatorConfig.xml 3.maven命令生成文件 一.pom.xml 1.引入依赖 <mysql ...

  3. lucene-Field.Store解析

    本文主要内容装载这里 Store 三种形态 COMPRESS:压缩保存.用于长文本或二进制数据 (后期高版本舍弃了) YES:保存 NO:不保存 具体案例 package demo.first; im ...

  4. httpclient提示Cookie rejected: violates RFC 2109: domain must start with a dot

    使用httpclient时发生如下告警信息: WARN - HttpMethodBase.processResponseHeaders(1505) | Cookie rejected: "$ ...

  5. cygwin-使用介绍

    cygwin使用: 使用上的方便性很是不错,启动Cygwin以后,会在Windows下得到一个Bash Shell,由于Cygwin是以Windows下的服务运行的,所以很多情况下和在Linux下有很 ...

  6. 【转】Private Libraries、Referenced Libraries、Dependency Libraries的区别

    一.v4.v7.v13的作用和用法 1.Android Support V4, V7, V13是什么? 本质上就是三个java library. 2.为什么要有support库?   是为了解决软件的 ...

  7. bzoj 1208 splay模板题2

    自己yy了找前驱和后继,学了学怎么删除...(反正就是练模板) #include<iostream> #include<cstdio> #include<cstring& ...

  8. 【BZOJ-4561】圆的异或并 set + 扫描线

    4561: [JLoi2016]圆的异或并 Time Limit: 30 Sec  Memory Limit: 256 MBSubmit: 254  Solved: 118[Submit][Statu ...

  9. [NOIP2015] 提高组 洛谷P2661 信息传递

    题目描述 有n个同学(编号为1到n)正在玩一个信息传递的游戏.在游戏里每人都有一个固定的信息传递对象,其中,编号为i的同学的信息传递对象是编号为Ti同学. 游戏开始时,每人都只知道自己的生日.之后每一 ...

  10. 帝国CMS文章随机调用等一些常用标签

    1.帝国CMS文章随机调用等一些常用标签 [e:loop={'news',10,18,0,'newstime>UNIX_TIMESTAMP()-86400*7','onclick desc'}] ...