初学CSS3的第一天,虽然之前有接触过CSS,不过好像是CSS2,我也上网了解了一下CSS3,新增了很多强大的元素,也让我更有兴趣去学习了。

CSS(Cascading Style Sheets) 层叠样式表

不同浏览器可能需要不同的前缀,这也是为了考虑可以更好的向前兼容

   前缀     浏览器
  -webkit    chrome和safari
  -moz     firefox
  -ms      IE
   -o     opera

CSS最重要的就是将表现与结构分离,提高代码的可读性,更方便的修改和查阅代码。

CSS的语法结构:

  selector{Property:Value;}

  选择符  属性    值

例子:

  body{background-color:red;}

  h1{font-size:12px;}

引入CSS的方法有三种:

  1.行内引入:

    

    <body style="background-color:red;"></body>

   <h1 style="font-size:12px;"></h1>    

  2.页内引入:

    

<head>
<title></title>
<style>
body{
background-color:red;
}
h1{
font-size:12px;
}
</style>
</head>

  3.外部样式表:

    style.css:  

body {
background-color:#cccccc;
}
 h1{
font-size:12px;
}

    index.html:

<head>
<title></title>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>

三种引入方法的优先级比较:

  就近原则:行内引入>页内引入>页外引入

注释方法:

  /*注释内容*/

  

CSS3的chapter1的更多相关文章

  1. 使用 HTML5、CSS3 和 MathML 在 EPUB 3 中制作版式丰富的出版物

    探索用于高级排版和印刷的新一代开放电子书标准 EPUB 3.0 是最新的行业标准 XML 电子书格式,它采用了 HTML5 和 CSS3,因而融入了现代 Web 技术.它重点关注 XML 驱动的工具包 ...

  2. 纯CSS3实现的一些酷炫效果

    之前在网上看到一些用纯CSS3实现的酷炫效果,以为实现起来比较困难,于是想看看具体是怎么实现的. 一.笑脸猫动画 实现效果如下: 这个实现起来确实比较麻烦,很多地方需要花时间,有耐心地调整. 1.先看 ...

  3. CSS3 border-radius边框圆角

    在CSS3中提供了对边框进行圆角设定的支持,可对边框1~4个角进行圆角样式设置. 目录 1. 介绍 2. value值的格式和类型 3. border-radius 1~4个参数说明 4. 在线示例 ...

  4. CSS3 3D立方体效果-transform也不过如此

    CSS3系列已经学习了一段时间了,第一篇文章写了一些css3的奇技淫巧,原文戳这里,还获得了较多网友的支持,在此谢过各位,你们的支持是我写文章最大的动力^_^. 那么这一篇文章呢,主要是通过一个3D立 ...

  5. 三分钟学会用 js + css3 打造酷炫3D相册

    之前发过该文,后来不知怎么回事不见了,现在重新发一下. 中秋主题的3D旋转相册 如图,这是通过Javascript和css3来实现的.整个案例只有不到80行代码,我希望通过这个案例,让正处于迷茫期的j ...

  6. 使用CSS3实现一个3D相册

    CSS3系列我已经写过两篇文章,感兴趣的同学可以先看一下CSS3初体验之奇技淫巧,CSS3 3D立方体效果-transform也不过如此 第一篇主要列出了一些常用或经典的CSS3技巧和方法:第二篇是一 ...

  7. Web大前端时代之:HTML5+CSS3入门系列

    准备来一波新技术,待续.... Old: 联系源码:https://github.com/dunitian/LoTHTML5 文档下载:https://github.com/dunitian/LoTD ...

  8. 07. Web大前端时代之:HTML5+CSS3入门系列~H5 地理位置

    Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html 源码:https://github.com/duniti ...

  9. 前端制作动画的几种方式(css3,js)

    制作动态的网页是是前端工程师必备的技能,很好的实现动画能够极大的提高用户体验,增强交互效果,那么动画有多少实现方式,一直对此有选择恐惧症的我就总结一下,以便在开发的时候选择最好的实现方式. 1.css ...

随机推荐

  1. 在win7下安装unbuntu系统

    1.分盘 准备EasyBCD,ubuntu操作系统 配置EasyBCD,安装ubuntu http://www.linuxidc.com/Linux/2014-04/100369.htm http:/ ...

  2. BizTalk动手实验(三)BizTalk开发综合实验

    1 课程简介 通过本课程熟悉BizTalk开发组件Schema/Map/Orchestration/Pipeline的开发与配置 2 准备工作 3 演示 3.1 创建与配置BizTalk应用程序 1. ...

  3. Spinner的深入学习

    简介: spinner是一个列表选择框,会在用户选择后,展示一个列表供用户进行选择.Spinner是ViewGroup的间接子类,它和其他的Android控件一样,数据需要使用Adapter进行封装. ...

  4. JAVA程序设计 实验一

    北京电子科技学院(BESTI) 实     验    报     告 课程:Java程序设计 班级:1353  姓名:李海空  学号:20135329 成绩:             指导教师:娄嘉鹏 ...

  5. win commands

    wmic process where name="explorer.exe" delete 我想你问得应该是运行命令吧!我查了,没有,你自己参考一下:Windows常用命令集 wi ...

  6. 如何获取imageView中当前内容的相关信息并比较?

    public class MainActivity extends Activity implements OnClickListener{ private Button button; privat ...

  7. HTML5实现下载文件且指定下载文件名

    <a href="/files/adlafjlxjewfasd89asd8f.pdf" download="预算表.pdf">下载</a> ...

  8. JQuery选择器中含有冒号的ID处理差异的分析

    问题提出 对于一个输入框, 如果其id中含有冒号(:),选择器使用需要有特殊写法, 例如 id为下 <input type="text" value="ddd&qu ...

  9. mysql apache php install

    设置LINUX自动匹配环境变量 1.$su #su进入root #vi /etc/profile 在文件末尾加上下列语句: PATH=$PATH:/sbin #在PATH变量后追加/sbin目录 ex ...

  10. 模板 BFS

    [模板]BFS #include <stdio.h> #include <string.h> #include <queue> using namespace st ...