今天2005年7月9号,博客这个东西还真不懂,以前吧我不认识它,它也不认识我。没辙,汤老要我们写,就写吧。

写什么好呢?那就写今天学习的css3的一些要点吧。

  css这门课程几乎都学完了。而我觉得我还不错吗,还认识几个单词了,呵呵。基本格式也都会了。甚至能写几个小小的网页,当然,这些对于大神朋友们而言,小菜一碟。不过我是新手,给点鼓励吧。言归正传,正式上菜:

  一、新增选择符

  • E:first-child {属性:值 }    匹配父元素的第一个子元素E。

    要使该属性生效,E元素必须是某个元素的子元素,E的父元素最高是body,即E可以是body的子元素

    E:first-child选择符,E必须是它的兄弟元素中的第一个元素,换言之,E必须是父元素的第一个子元素。与之类似的伪类还有E:last-child,只不过情况正好相反,需要它是最后一个子元素。

  • E:only-child { 属性:值 }   匹配父元素仅有的一个子元素E。

    要使该属性生效,E元素必须是某个元素的子元素,E的父元素最高是body,即E可以是body的子元素

  •   E:nth-child(n) { 属性:值 }   匹配父元素的第n个子元素E,假设该子元素不是E,则选择符无效。

    

    要使该属性生效,E元素必须是某个元素的子元素,E的父元素最高是body,即E可以是body的子元素

    该选择符允许使用一个乘法因子(n)来作为换算方式,比如我们想选中所有的偶数子元素E,那么选择符可以写成:E:nth-child(2n)

  •   E:first-of-type {属性:值}     匹配同类型中的第一个同级兄弟元素E。

     

      要使该属性生效,E元素必须是某个元素的子元素,E的父元素最高是html,即E可以是html的子元素,也就是说E可以是body

      该选择符总是能命中父元素的第1个为E的子元素,不论第1个子元素是否为E

  • E:focus { 属性:值}   设置对象在成为输入焦点(该对象的onfocus事件发生)时的样式。

、背景

    background-origin<box> [ , <box> ]*

    <box> = border-box | padding-box | content-box

  设置或检索对象的背景图像计算background-position时的参考原点(位置)。

  对应的脚本特性为backgroundOrigin

 

padding-box:
从padding区域(含padding)开始显示背景图像。
border-box:
从border区域(含border)开始显示背景图像。
content-box:
从content区域开始显示背景图像。
  • background-clip<box> [ , <box> ]*指定对象的背景图像向外裁剪的区域。

<box> = border-box | padding-box | content-box | text

padding-box:
从padding区域(不含padding)开始向外裁剪背景。
border-box:
从border区域(不含border)开始向外裁剪背景。
content-box:
从content区域开始向外裁剪背景。
text:
从前景内容的形状(比如文字)作为裁剪区域向外裁剪,如此即可实现使用背景作为填充色之类的遮罩效果。遮罩效果 See with Webkit

<bg-size> = [ <length> | <percentage> | auto ]{1,2} | cover | contain

    • 该属性提供2个参数值(特性值cover和contain除外)。
    • 如果提供两个,第一个用于定义背景图像的宽度,第二个用于定义背景图像的高度。
    • 如果只提供一个,该值将用于定义背景图像的宽度,第2个值默认为auto,即高度为auto,此时背景图以提供的宽度作为参照来进行等比缩放。
    • 对应的脚本特性为backgroundSize

          

        

CSS3学习内容与心得的更多相关文章

  1. 从实例学习 Go 语言、"并发内容" 学习笔记及心得体会、Go指南

    第一轮学习 golang "并发内容" 学习笔记,Go指南练习题目解析.使用学习资料 <Go-zh/tour tour>.记录我认为会比较容易忘记的知识点,进行补充,整 ...

  2. web前端开发学习内容

    应该 具备的 知识技能 :懂web标准,熟练手写 xhtml css3 并符合 符合w3c标准                       代码能 兼容主流浏览器.ie6.7.8.9 ff 等.    ...

  3. 总结一下这几天学习django的心得

    总结一下这几天学习django的心得 http://www.tuicool.com/articles/jMVB3e 时间 2014-01-12 11:40:11  CSDN博客 原文  http:// ...

  4. CSS3学习笔记(3)-CSS3边框

    p{ font-size: 15px; } .alexrootdiv>div{ background: #eeeeee; border: 1px solid #aaa; width: 99%; ...

  5. HTML5与CSS3权威指南之CSS3学习记录

    title: HTML5与CSS3权威指南之CSS3学习记录 toc: true date: 2018-10-14 00:06:09 学习资料--<HTML5与CSS3权威指南>(第3版) ...

  6. HTML5 CSS3学习

    HTML5 CSS3学习 :http://www.1000zhu.com/course/css3/ HTML5 相关书籍:   http://www.html5cn.com.cn/news/gdt/2 ...

  7. STM32学习内容和计划

    一.STM32学习内容(流程) 1.学习STM32开发流程 ①MDK使用.建立工程.调试等 ②库开发方法 2.学习STM32常用外设开发 ①GPIO ②中断 ③定时器 ④串口 ⑤CAN 3.学习STM ...

  8. u-boot代码学习内容

    前言  u-boot代码庞大,不可能全部细读,只能有选择的读部分代码.在读代码之前,根据韦东山教材,关于代码学习内容和深度做以下预先划定. 一.Makefile.mkconfig.config.mk等 ...

  9. CSS3学习之圆角box-shadow,阴影border-radius

    最近经常玩腾讯微博,出来职业习惯,看看它的CSS,里面运用了大量的css3的东东,有一处用到了Data URI,还有css e­xpression有争议的地方,对png24图片的处理也是用滤镜,类似( ...

随机推荐

  1. 获得、修改 SQL Server表字段说明

    SELECT ( then d.name else '' end) 表名, a.colorder 字段序号, a.name 字段名, g.[value] AS 字段说明 FROM syscolumns ...

  2. 写给java开发的运维笔记

    转载至:https://github.com/biezhi/java-bible/tree/master/learn_server

  3. 个人JS零碎知识整理

    1."DOM2级事件"规范要求的事件流包括三个阶段:事件捕获阶段.处于目标阶段.事件冒泡阶段 2.isNaN()       数字.空串.空格 返回false 变量是数字时返回fa ...

  4. 【解决】SharePoint 2013 当鼠标悬停在用户名称上时页面会崩溃

    参考下面文章,此问题是由于IE中的Office插件版本不正确所致,只需在 控制面板 > 程序和功能 中修复 Office 的安装即可. http://sympmarc.com/2013/11/2 ...

  5. Linux学习笔记之——基础命令学习

    1.find 按照名字查找:find / -name file_name   2.zip压缩 1) 我想把一个文件repartition.txt和一个目录invader压缩成为amateur.zip: ...

  6. 开源的运维机器人hubot原理

  7. sqlserver 2008 建立订阅发布时 报错 解决方案 “错误 2812” 无法创建存储过程

    11月10日早上  一大早,还在地铁14号线上 ,接到同事给的信息 说我们的XX系统宕机了,本想没什么问题,一般服务器 只要硬件没有问题 重启一下就可以了, 但是事与愿违,偏偏最后检测到服务器磁盘阵列 ...

  8. json工具包比较 fastjson jackson gson

    对json进行json-object进行相互转化时,笔者接触到三种工具jar,现对其进行比较. fastjson:速度最快,阿里巴巴开源. jackson:springMvc 默认使用. gson:谷 ...

  9. W5200移植W5500驱动教程

    说明,移植例程为我按照这个教程移植的例程,测试通过.工程模板为我经常使用的一个w5500模板,可以在里面直接添加文件编程.1. 将driver文件夹中W5500文件夹和所有.c文件复制到工程/sour ...

  10. 细说IIS异常日志 — 你必须知道的功能

    最近在跟QAD用Webservice搞接口做数据维护,搞的哥那个叫头大,遇到很多问题,系统的log4net根本就无法记录.话说QAD调我某一个接口,可能包含几百个字段,而且QAD是个产品,所以我这边提 ...