CSS 用于控制网页的样式和布局。

CSS3 是最新的 CSS 标准。

一. CSS3边框

实例

向 div 元素添加圆角:

div
{
border:2px solid;
border-radius:25px;
-moz-border-radius:25px; /* Old Firefox */
}

CSS3 边框阴影

在 CSS3 中,box-shadow 用于向方框添加阴影:

实例

向 div 元素添加方框阴影:

div
{
box-shadow: 10px 10px 5px #888888;
} 

CSS3 边框图片

通过 CSS3 的 border-image 属性,您可以使用图片来创建边框:

border-image 属性允许您规定用于边框的图片!

用于创建上面的边框的原始图片:

实例

使用图片创建围绕 div 元素的边框:

div
{
border-image:url(border.png) 30 30 round;
-moz-border-image:url(border.png) 30 30 round; /* 老的 Firefox */
-webkit-border-image:url(border.png) 30 30 round; /* Safari 和 Chrome */
-o-border-image:url(border.png) 30 30 round; /* Opera */
}

 

属性 描述 CSS
border-image 设置所有 border-image-* 属性的简写属性。 3
border-radius 设置所有四个 border-*-radius 属性的简写属性。 3
box-shadow 向方框添加一个或多个阴影。 3

CSS3 入门到精通(一)的更多相关文章

  1. HTML5+CSS3从入门到精通随书光盘 ISO 镜像视频教程​

    HTML5+CSS3从入门到精通(清华社“视频大讲堂”大系)通过基础知识+中小实例+综合案例的方式,讲述了用HTML5+ CSS3设计构建网站的必备知识,相对于权威指南.高级程序设计.开发指南同类图书 ...

  2. HTML5+CSS3从入门到精通 中文pdf版​

    HTML5+CSS3从入门到精通是通过基础知识+中小实例+综合案例的方式,讲述了用HTML5+ CSS3设计构建网站的必备知识,相对于专业指南.高级程序设计.开发指南同类图书,本书是一本适合快速入手的 ...

  3. HTML5从入门到精通(千锋教育)免费电子版+PDF下载

    本书是HTML5初学者极好的入门教材之一,内容通俗易懂.由浅入深.循序渐进.本书内容覆盖全面.讲解详细,其中包括标签语义化.标签使用规范.选择器类型.盒模型.标签分类.样式重置.CSS优化.Photo ...

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

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

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

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

  6. <程序员从入门到精通> -- How

    定位 自己才是职业生涯的管理者,想清楚自己的发展路径: 远期的理想是什么?近期的规划是什么?今日的任务和功课又是什么? 今日之任务或功课哪些有助于近期之规划的实现,而近期之规划是否有利于远期之理想? ...

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

    Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html 文档申明 <!--文档类型申明,html代表是ht ...

  8. 02.Web大前端时代之:HTML5+CSS3入门系列~H5结构元素

    Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html 1.结构元素 可以理解为语义话标记,比如:以前这么写&l ...

  9. 03.Web大前端时代之:HTML5+CSS3入门系列~H5功能元素

    Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html 2.功能元素 1.hgroup 对网页或区段(secti ...

随机推荐

  1. 【Offer】[52] 【两个链表的第一个公共结点】

    题目描述 思路分析 测试用例 Java代码 代码链接 题目描述 输入两个链表,找出它们的第一个公共结点.下图中6为公共结点:  牛客网刷题地址 思路分析 如果两个链表有公共节点,那么公共节点出现在两 ...

  2. 【LeetCode】524-通过删除字母匹配到字典里最长单词

    题目描述 给定一个字符串和一个字符串字典,找到字典里面最长的字符串,该字符串可以通过删除给定字符串的某些字符来得到.如果答案不止一个,返回长度最长且字典顺序最小的字符串.如果答案不存在,则返回空字符串 ...

  3. springboot过滤器的实现

    springboot过滤器的实现 如下所示: import javax.servlet.*; import javax.servlet.annotation.WebFilter;import java ...

  4. 4.String、StringBuffer、StringBuilder

    一.String类型 String类型是一个引用类型,但是该类被final修饰,属于最终类,不能派生子类. 字符串一旦初始化就不能再被更改,因为String类中存储内容的char[]数组是也被fina ...

  5. linux 常用压缩、解压命令

    .tar.gz     解压为          tar   -zxvf   xx.tar.gz    压缩为 tar -zcvf  target.tar.gz ./src_dir zip 解压为   ...

  6. 从网页跳转到自己的app

    展开该数据并点击 Item 0.你将在这里定义自定义 URL scheme 的名字.只需要名字,不要在后面追加 :// — 比如,如果你输入 iOSDevApp,你的自定义 url 就是 iOSDev ...

  7. C++程序设计学习

    第一章 预备知识 1.C++历史起源 由于C语言具有许多优点,比如语言简洁灵活:运算符和数据类型丰富:具有结构化控制语句:程序执行效率高:同时具有高级语言和汇编语言的优点等.与其他高级语言相比,C语言 ...

  8. [Leetcode] 第313题 超级丑数

    一.题目描述 编写一段程序来查找第 n 个超级丑数. 超级丑数是指其所有质因数都是长度为 k 的质数列表 primes 中的正整数. 示例: 输入: n = 12, primes = [2,7,13, ...

  9. java Mail如何发送邮件

    1.应用场景:在系统需要发送与用户相关的消息时,而用户不在线,可以采取发送邮件的方式,使用户了解最新的系统情况 或者发送验证码等验证场景 2.实验环境 主要使用mail.jar和activation. ...

  10. Splitting into digits CodeForce#1104A

    题目链接:Splitting into digits 题目原文 Vasya has his favourite number