CSS3的chapter1
初学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的更多相关文章
- 使用 HTML5、CSS3 和 MathML 在 EPUB 3 中制作版式丰富的出版物
探索用于高级排版和印刷的新一代开放电子书标准 EPUB 3.0 是最新的行业标准 XML 电子书格式,它采用了 HTML5 和 CSS3,因而融入了现代 Web 技术.它重点关注 XML 驱动的工具包 ...
- 纯CSS3实现的一些酷炫效果
之前在网上看到一些用纯CSS3实现的酷炫效果,以为实现起来比较困难,于是想看看具体是怎么实现的. 一.笑脸猫动画 实现效果如下: 这个实现起来确实比较麻烦,很多地方需要花时间,有耐心地调整. 1.先看 ...
- CSS3 border-radius边框圆角
在CSS3中提供了对边框进行圆角设定的支持,可对边框1~4个角进行圆角样式设置. 目录 1. 介绍 2. value值的格式和类型 3. border-radius 1~4个参数说明 4. 在线示例 ...
- CSS3 3D立方体效果-transform也不过如此
CSS3系列已经学习了一段时间了,第一篇文章写了一些css3的奇技淫巧,原文戳这里,还获得了较多网友的支持,在此谢过各位,你们的支持是我写文章最大的动力^_^. 那么这一篇文章呢,主要是通过一个3D立 ...
- 三分钟学会用 js + css3 打造酷炫3D相册
之前发过该文,后来不知怎么回事不见了,现在重新发一下. 中秋主题的3D旋转相册 如图,这是通过Javascript和css3来实现的.整个案例只有不到80行代码,我希望通过这个案例,让正处于迷茫期的j ...
- 使用CSS3实现一个3D相册
CSS3系列我已经写过两篇文章,感兴趣的同学可以先看一下CSS3初体验之奇技淫巧,CSS3 3D立方体效果-transform也不过如此 第一篇主要列出了一些常用或经典的CSS3技巧和方法:第二篇是一 ...
- Web大前端时代之:HTML5+CSS3入门系列
准备来一波新技术,待续.... Old: 联系源码:https://github.com/dunitian/LoTHTML5 文档下载:https://github.com/dunitian/LoTD ...
- 07. Web大前端时代之:HTML5+CSS3入门系列~H5 地理位置
Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html 源码:https://github.com/duniti ...
- 前端制作动画的几种方式(css3,js)
制作动态的网页是是前端工程师必备的技能,很好的实现动画能够极大的提高用户体验,增强交互效果,那么动画有多少实现方式,一直对此有选择恐惧症的我就总结一下,以便在开发的时候选择最好的实现方式. 1.css ...
随机推荐
- 20145337《JAVA程序设计》第一周学习总结
# 20145337 <Java程序设计>第1周学习总结 ## 教材学习内容总结 第一章 -Java最早是Sun公司撰写Star7应用程序的程序语言 -根据应用领域不同,有Java SE. ...
- 词频junit测试
package search; import java.io.BufferedReader; import java.io.File; import java.io.FileReader; impor ...
- Spinner的深入学习
简介: spinner是一个列表选择框,会在用户选择后,展示一个列表供用户进行选择.Spinner是ViewGroup的间接子类,它和其他的Android控件一样,数据需要使用Adapter进行封装. ...
- IOS第15天(3,事件处理,手势处理)
7> 手势识别 使用UIImageView原因:之前既能看见图片,又能监听点击的只有UIButton,学了手势,我们的UIImageView也可以. * tap(代理:左边不能点,右 ...
- Redis和Memcache对比及选择(转载)
- Shell displays color output
格式: echo "/033[字背景颜色;字体颜色m字符串/033[控制码" 如果单纯显示字体颜色可以固定控制码位0m. 格式: echo "/033[字背景颜色;字体颜 ...
- Oracle在dos命令下导出导入
DOS下运行的命令,也可以加参数在SQL/PLUS环境下运行简单例子实现 单表备份(前提库的结构是一样的)导出:开始钮->运行->输入CMD->进入DOS界面EXP 用户名/密码@连 ...
- Java 使用jaxp修改节点
<?xml version="1.0" encoding="UTF-8" standalone="no"?> <perso ...
- 20145320《Java程序设计》第三次实验报告
20145320<Java程序设计>第三次实验报告 北京电子科技学院(BESTI)实验报告 课程:Java程序设计 班级:1453 指导教师:娄嘉鹏 实验日期:2016.04.22 15: ...
- Java反射深入浅出(一)
在JVM中对一个类实例的创建,有两种方式,一种是编译时,一种是运行时.两种方式在开发过程中都是十分重要的.在Java中无时无刻无处不在的Java对象,实例化的过程也就变得尤为引人瞩目.我们经常用new ...