css优先级:

!important 〉  行内样式  > id选择器  > 类选择器|伪类选择器  > 标签选择器  >  通用选择器  > 继承属性

综合优先级(只讨论选择器):

则下列选择器的优先级如何呢?

.a1 div{}

.a1 .a2{}

.a1 div .a2 span{}

#d1 div {}

#d1 .a1 {}

则他们比较优先级的原则是:

1,  比较最高的优先级选择器的多少,多者胜;

2,  最高的数量相等的时候,比较次高,多者胜;

3,  依次类推

css背景:

background-color: 背景颜色

background-image: url(背景图的路径);

background-repeat: 设置背景图的重复特性,有:repeat(默认值),no-repeat,repeat-x,  repeat-y

background-position: 需要两个值:水平位置  垂直位置。

è background:综合属性可以设置背景的所有特性,包括上述所有。

一个常见错误:

  background-image: url( images/abc.gif )  no-repeat  center center;

  ——background-image是独立属性,只能设置背景图,不能设置其他值了。

列表样式

  list-style-type: 设置列表符号,可以是我们之前学的无序列表符或有序列表符。

  list-style-image:设置列表的图片(此时list-style-type自动就无效了,被代替了)

  list-style-position: 指将列表符放在li的里面还是外面:outside(外面,默认值),inside(里面)

  list-style: 这是综合属性,可以设置上述几个。

border样式:

线有3个方面的特性:线型,线宽,线色,每个特性都可以单独控制。边框也有4个方向,每个方向都可以单独控制。

border-top-style: 顶部边框的线型。常见线型:solid ,  dashed,  dotted

border-top-width: 顶部边框的线宽;

border-top-color: 顶部边框的线色;

border-right-style,  border-right-width, border-right-color, ......就是12个

除此之外,我们还有3个设置线的某方面特性的综合属性:

border-style: 可以使用1-4个值,用来设置4个方向的线的线型,比如:border-style:solid dashed;  表示上下边框为实线,左右边框为虚线;

border-width: 同理,可以设置1-4个值,表示4个方向的线宽。

border-color:同理。

还有:4个设置每个方向边框的所有特性的综合属性:

border-top: 线型  线宽  线颜色;

border-right: 线型  线宽  线颜色;

border-bottom: 线型  线宽  线颜色;

border-left: 线型  线宽  线颜色;

最后,一个最大的综合属性:一次性设置4个方向的3个特性:

border: 线型  线宽  线颜色;

定位属性:position

1,  position:static          ——静态定位(默认)

2,  position:relative;      ——相对定位(相对正常文档流定位,不会脱离文档流,占原来布局空间大小)。

3,  position:absolute;    ——绝对定位(相对整个网页主体,脱离文档流,不占布局空间)。

4,  position:fixed;         ——固定定位(相对于浏览器窗口,脱离文档流,不占布局空间)。

块盒子和行内盒子相互转换

  块盒子,其display属性的值默认是block

  行内盒子,其display属性的值默认是inline;

  div{ display: inline;}           ——此时div就跟span一样。

  span{ display: block;}        ——此时span就跟div一样。

  display: none   不显示

转载于:https://www.cnblogs.com/zixueit/p/3868013.html

css常用或不熟悉的相关推荐

  1. div css 常用技巧

    div css 常用技巧 1.给图片加上alt属性:  <img src="logo.gif" alt="我的公司logo,点击返回首页" /> 2 ...

  2. css规则中区块block,css常用属性总结:背景background下篇

    前言:这段时间天天加班到10:30之后,简直是x了. 在上一篇文章中,分别解析了background各个属性的用法和注意细节.如果我们在项目上使用背景效果,如果使用下面的写法,你可能抓狂. body{ ...

  3. css文字向右对齐_web前端入门到实战:css常用样式对文本的处理演练

    CSS文本属性可定义文本的外观,这是毫无疑问的,其次css可以通过以下属性改变文字的排版,比方说letter-spacing实现字符间距text-indent: 2em;完成首行缩进2字符word-s ...

  4. CSS常用样式及示例

    CSS常用样式及示例 一.简介 层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式 ...

  5. [css] css常用的布局方式有哪些?

    [css] css常用的布局方式有哪些? 1:圣杯布局 2:双飞翼 3:flex 个人简介 我是歌谣,欢迎和大家一起交流前后端知识.放弃很容易, 但坚持一定很酷.欢迎大家一起讨论 主目录 与歌谣一起通 ...

  6. CSS常用的元素居中方法

    参考:CSS: 常用的元素居中方法 CSS居中布局总结 1.水平居中 (1)文本水平居中 text-align: center; (2)块级元素水平居中 ①设置margin margin: auto; ...

  7. html双箭头菜单,CSS常用样式之绘制双箭头的示例代码

    一.多次调用单箭头 实现了单箭头–就很容易实现双箭头了,上文已经介绍2种实现单箭头的原理: 边框旋转方式.双三角覆盖方式.这次以边框旋转为例多次调用实现双箭头. 1.边框旋转单箭头实现 .arrow- ...

  8. [Web 前端] 010 css 常用的边框设置

    css 常用边框属性 概览 参数 释义 border u设置边框属性(可以多个) border-color 边框颜色 border-style 边框样式 solid 实线,dotted 点状线,das ...

  9. css图片菜鸟教程,css 常用样式(分享)

    font-family设置字体名称 可以使用多个名称,用逗号分隔,浏览器则按照先后顺序依次使用可用字体 p { font-family:'宋体','黑体','Arial'; } font-size 设 ...

最新文章

  1. java面向对象-------静态初始化块
  2. Swagger 入门使用
  3. python 图形界面库对比
  4. 每天60秒读懂世界20211127
  5. java itextsharp_使用 c#中的 itextsharp 以 pdf 格式填充 xml
  6. ObjectInputStream和ObejctOutputStream
  7. 搭建一个简单的Spring boot+maven项目
  8. 或者是修改服务器时间,修改云服务器时间设置
  9. 自定义异常和经验小结
  10. 机器学习中常见的距离公式
  11. oracle数据库关联查询
  12. java修改excel图表数据源,导出excel图表文件
  13. [PDDL人工智能] 01.PDDL规划器安装及入门详解(规划领域定义语言)
  14. 设置Centos7时区
  15. Kotlin基础知识5
  16. 转载:信号与系统的简介
  17. iOS 获取屏幕尺寸
  18. c语言循环程序模板,循环结构程序设计C语言程序
  19. Noble - Window平台NodeJs蓝牙BLE开发库
  20. 华为手机usb计算机连接在哪里设置密码,简单十步设置Huawei Share,手机与电脑传输从此告别数据线...

热门文章

  1. Oracle数据库块的物理损坏与逻辑损坏
  2. 二维数组传入函数_C++二维动态数组memset()函数初始化
  3. 打牢Python基础,看看这10语法如何
  4. 知识总结和记录——递归
  5. WordPress 安装插件导致 HTTP 500 内部服务器错误的问题
  6. 搞懂 Java equals 和 hashCode 方法
  7. 标量、向量、矩阵、张量
  8. springboot应用启动原理(一) 将启动脚本嵌入jar
  9. 大数据发展火爆,云计算平台主打安全至上
  10. Glusterfs(distribute) + DRBD + heartbeat + mon 实现分布式文件系统1