CSS3 入门到精通(一)
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 入门到精通(一)的更多相关文章
- HTML5+CSS3从入门到精通随书光盘 ISO 镜像视频教程
HTML5+CSS3从入门到精通(清华社“视频大讲堂”大系)通过基础知识+中小实例+综合案例的方式,讲述了用HTML5+ CSS3设计构建网站的必备知识,相对于权威指南.高级程序设计.开发指南同类图书 ...
- HTML5+CSS3从入门到精通 中文pdf版
HTML5+CSS3从入门到精通是通过基础知识+中小实例+综合案例的方式,讲述了用HTML5+ CSS3设计构建网站的必备知识,相对于专业指南.高级程序设计.开发指南同类图书,本书是一本适合快速入手的 ...
- HTML5从入门到精通(千锋教育)免费电子版+PDF下载
本书是HTML5初学者极好的入门教材之一,内容通俗易懂.由浅入深.循序渐进.本书内容覆盖全面.讲解详细,其中包括标签语义化.标签使用规范.选择器类型.盒模型.标签分类.样式重置.CSS优化.Photo ...
- 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 ...
- <程序员从入门到精通> -- How
定位 自己才是职业生涯的管理者,想清楚自己的发展路径: 远期的理想是什么?近期的规划是什么?今日的任务和功课又是什么? 今日之任务或功课哪些有助于近期之规划的实现,而近期之规划是否有利于远期之理想? ...
- 01.Web大前端时代之:HTML5+CSS3入门系列~初识HTML5
Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html 文档申明 <!--文档类型申明,html代表是ht ...
- 02.Web大前端时代之:HTML5+CSS3入门系列~H5结构元素
Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html 1.结构元素 可以理解为语义话标记,比如:以前这么写&l ...
- 03.Web大前端时代之:HTML5+CSS3入门系列~H5功能元素
Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html 2.功能元素 1.hgroup 对网页或区段(secti ...
随机推荐
- 单细胞转录组测序技术(scRNA-seq)及细胞分离技术分类汇总
单细胞测序流程(http://learn.gencore.bio.nyu.edu) 在过去的十多年里,高通量测序技术被广泛应用于生物和医学的各种领域,极大促进了相关的研究和应用.其中转录组测序(RNA ...
- Java机械分词
这是我们做的一个小作业,不多说 直接附上我写的代码: public void Zheng() { try { BufferedReader bre = null; //String file = &q ...
- Java测试(二)
一.选择题(每题2分,共40分) 1.下面哪个是Java语言中正确的标识符(C ) a) 3com b)import c)that d)this 2.下面哪个语句 ...
- JAVA特性:原子性、可见性、有序性
Java特性:原子性.可见性.有序性 原子性(操作是不可分.操作不可被中断):是指一个操作是不可中断的.即使是多个线程一起执行的时候,一个操作一旦开始,就不会被其他线程干扰.(synchronized ...
- Linux 笔记 - 第八章 文档的打包与压缩
博客地址:http://www.moonxy.com 一.前言 在 Linux 系统中,文件的后缀名没有实际的意义,加或者不加都无所谓.但是为了便于区分,我们习惯在定义文件名时加一个后缀名,比如常见的 ...
- C++解决最基本的迷宫问题
问题描述:给定一个最基本的迷宫图,用一个数组表示,值0表示有路,1表示有障碍物,找一条,从矩阵的左上角,到右下角的最短路.求最短路,大家最先想到的可能是用BFS求,本文也是BFS求最短路的. 源代码如 ...
- 关于瀑布流的布局原理分析(纯CSS瀑布流与JS瀑布流)
瀑布流 又称瀑布流式布局,是比较流行的一种网站页面布局方式.即多行等宽元素排列,后面的元素依次添加到其后,等宽不等高,根据图片原比例缩放直至宽度达到我们的要求,依次按照规则放入指定位置. 为什么使用瀑 ...
- SPN扫描
0x01介绍 Kerberos是一种支持票证身份验证的安全协议.如果客户端计算机身份验证请求包含有效的用户凭据和服务主体名称 (SPN),则 Kerberos 身份验证服务器将授予一个票证以响应该请求 ...
- helm部署Filebeat + ELK
helm部署Filebeat + ELK 系统架构图: 1) 多个Filebeat在各个Node进行日志采集,然后上传至Logstash 2) 多个Logstash节点并行(负载均衡,不作为集群),对 ...
- Spring 梳理 - filter、interceptor、aop实现与区别 -第一篇
前言 项目中我们经常需要对RESTful api进行拦截,主流实现方法有filter.interceptor.aop,先说一下他们各自的实现. Filter AnimalFilter实现javax.s ...