css常用或不熟悉的

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   不显示

css常用或不熟悉的,布布扣,bubuko.com

时间: 2024-10-02 20:58:30

css常用或不熟悉的的相关文章

#3 CSS常用属性

CSS里面的样式非常多,但是常用的样式并不是很多. 下面主要是以下常用的,当然这个没涉及到考虑兼容性的问题.兼容性的主要还是要了解不懂浏览器之间的差异,具体我也半桶水,在努力学习中,等学会了,在总结一下分享给大家. -------2014.07.29 这个上课主要讲的布局,就是关于页面的布局,现在90%的网站都是用DIV+CSS布局的.所以应该好好掌握这次课的知识. 在学习DIV之前,我们还要熟悉一些常见的CSS样式. CSS的常用样式 字体: 1,line-height:50px      

实用掌中宝--HTML&CSS常用标签速查手册 PDF扫描版

实用掌中宝--HTML&CSS常用标签速查手册 内容推荐: 本书第一篇以语法和实例相结合的形式,详细讲解了HTML语言中各个元素及其属性的作用.语法和显示效果:第二篇从CSS基本概念开始,分别讲解了CSS基础知识.CSS控制各种元素显示的方法以及CSS布局页面的技巧等知识.为了使读者能尽快熟悉各种应用的具体方法,本书对所讲解的每个元素和属性都尽可能用简单直观的方法做了实例演示. 本书适合广大Web网站设计人员.网站设计的初学者.网站管理维护人员.大专院校学生和社会培训学员阅读,也可作为开发人员的

CSS常用样式(四)之animation

上篇CSS常用样式(三)这篇博文中已经介绍过了CSS中具有动画效果的transition.transform,今天来大概说说CSS中的animation.animation的加入会使得动画效果更加乐观. animation animation的实现需要通过keyframes来实现.keyframes(关键帧),类似于flash当中的关键帧.关键帧有其自己的语法规则,他的命名是由"@keyframes"开头,后面紧接着是这个“动画的名称”加上一对花括号“{}”,括号中就是一些不同时间段样

css常用样式属性详细介绍

对于初学css的来说,肯定会觉得这么多样式不好记,而且记住了也容易忘,其实刚开始我们不用去记这么多的样式,确实是记了也会忘,刚开始只需记住一些常用的就可以了,然后在慢慢的使用过程当中接触并学习一些高级点的,这才是一个靠谱的渐进过程,下面列出一些css常用属性,仅供参考 “文字”属性共有8项: 1.“字体”(font-family),设定时,需考虑浏览器中有无该字体. 2.“大小”(font-size),注意度量单位. 3.“粗细”(font-weight),除了normal(正常).bold(粗

css常用文本属性

[CSS常用文本属性] 1. 字体.字号类: ① font-weight: 字体粗细. bold-加粗.normal-正常.lighter-细体 也可以使用100-900数值,400表示normal,700表示bold ② font-style: 字体样式. italic-倾斜.normal-正常 ③ font-size: 字号. 可以写px单位,也可以写% 200%表示浏览器默认大小(16px)的两倍=32px ④ font-family: 字体系列(字体族). >>> 可以直接写字体

CSS常用浮出层的写法

<!doctype html><html><head><meta charset="utf-8"><title>CSS常用浮出层的写法</title><style type="text/css">/* poptip */.poptip{position: absolute;top: 20px;left:20px;padding: 6px 10px 5px;*padding: 7px

【css】css常用选择器

css常用选择器 * 通配选择器 选择文档中所以HTML元素 E 元素选择器  选择指定类型的HTML元素 #id ID选择器  选择指定ID属性值为"id"的任意类型元素 .class 类选择器   选择指定class属性值为"class"的任意类型的任意多个元素 selector1,selectorN 群组选择器 将每一个选择器匹配的元素集合并 E F 后代选择器(包含选择器)  选择匹配的F元素,且匹配的F元素被包含在匹配的E元素内 E>F 子选择器 选

初学css常用属性整理

CSS常用样式属性 整理了一些之前刚学CSS时的一些基本的样式属性,另外在使用时还要注意一下CSS里 选择符的权重(id-#=100 , class-.=10 直接指定标签=1). 字体.颜色.背景属性 font-size  ------字体大小(**px,**em) font-family       ------字体类型(微软雅黑,黑体,楷体等) font-weight      ------字体粗细(bold粗体,也可直接输入100-900数值) font-style         --

HTML、CSS常用技巧

一.HTML 在介绍HTML之前,我们先看一下HTML的文档树结构,主要包括哪些: (一).头部标签 1,Doctype Doctype告诉浏览器使用什么样的HTML或XHTML规范来解析HTML文档. 有和无的区别: BackCompat:标准兼容模式未开启(怪异模式.混杂模式): CSS1Compat:标准兼容模式已开启(严格模式). 这个属性会被浏览器识别并使用,但是如果你的页面没有DOCTYPE的声明,那么compatMode默认就是BackCompat,这也就是恶魔的开始,浏览器按照自