1.圆角边框(div的一个属性:border-radius)

  

<!DOCTYPE html>
<html>
<head>
<style>
div
{
  text-align:center;
  border:2px solid #a1a1a1;
  padding:10px 40px;
  background:#dddddd;
  width:350px;
  border-radius:25px;
}
</style>
</head>
<body> <div>有圆角的div</div> </body>
</html>

  效果图:

2.边框阴影(box-shadow)

<!DOCTYPE html>
<html>
<head>
<style>
div
{
width:300px;
height:100px;
background-color:blue;
box-shadow: 15px 15px 30px red;
}
</style>
</head>
<body>
<div></div>
</body>
</html>

  效果图:

  

 

box-shadow:

    水平阴影、垂直阴影、模糊距离,以及阴影的颜色

    第一个参数--水平阴影,向右移动距离
    第二个参数--垂直阴影,向下移动距离
    第三个参数--模糊距离,把阴影拉远、变模糊
    第四个参数--阴影颜色

css3学习01的更多相关文章

  1. 【iScroll源码学习01】准备阶段 - 叶小钗

    [iScroll源码学习01]准备阶段 - 叶小钗 时间 2013-12-29 18:41:00 博客园-原创精华区 原文  http://www.cnblogs.com/yexiaochai/p/3 ...

  2. Python学习--01入门

    Python学习--01入门 Python是一种解释型.面向对象.动态数据类型的高级程序设计语言.和PHP一样,它是后端开发语言. 如果有C语言.PHP语言.JAVA语言等其中一种语言的基础,学习Py ...

  3. HTML5 CSS3学习

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

  4. Java虚拟机JVM学习01 流程概述

    Java虚拟机JVM学习01 流程概述 Java虚拟机与程序的生命周期 一个运行时的Java虚拟机(JVM)负责运行一个Java程序. 当启动一个Java程序时,一个虚拟机实例诞生:当程序关闭退出,这 ...

  5. Android Testing学习01 介绍 测试测什么 测试的类型

    Android Testing学习01 介绍 测试测什么 测试的类型 Android 测试 测什么 1.Activity的生命周期事件 应该测试Activity的生命周期事件处理. 如果你的Activ ...

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

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

  7. Java学习01

    Java学习01 第一章 1.JRE与JDK JDK(JAVA Develop Kit,JAVA开发工具包)提供了Java的开发环境和运行环境,主要用于开发JAVA程序,面向Java程序的开发者; J ...

  8. ThinkPhp学习01

    原文:ThinkPhp学习01 一.ThinkPHP的介绍           MVC  M - Model 模型                工作:负责数据的操作  V - View  视图(模板 ...

  9. css和css3学习

    css和css3学习 css布局理解 css颜色大全 样式的层叠和继承 css ::before和::after伪元素的用法 中文字体font-family常用列表 cursor属性 css选择器 F ...

随机推荐

  1. 构建一个真实的应用电子商务SportsStore9

    使用MVC4,Ninject,EF,Moq,构建一个真实的应用电子商务SportsStore(九) 实在不好意思,好久没有更新了,我不想找些客观原因来解释,只想请大家见谅!现在我们继续我们的项目,客户 ...

  2. android.view.WindowManager$BadTokenException: Unable to add window — token null is not for an applic

    之前遇到过这样的问题, 04-12 10:40:33.302: E/AndroidRuntime(17213): Caused by: android.view.WindowManager$BadTo ...

  3. java.lang.IllegalArgumentException: Wrong FS ...异常的解决

    配置完Hbase后,启动,JPS发现少了HMaster这个进程.查看了一下日志如下: java.lang.IllegalArgumentException: Wrong FS: hdfs://192. ...

  4. web打印小结

    项目中有个需求是将winform客户端的打印,移到网页上由客户自行打印,打印要求是根据一定的格式实现套打. 当时的解决方案是使用PDF打印: 1. 准备好套打格式的底图: 2.打开底图,将动态内容画到 ...

  5. log4net 开箱即用

    废话少说,先上代码 log4net Demo 好的系统都有日志,log4net 是我在.net平台下用过最爽的日志库,简单易用.功能强大. 基于配置(配置很简单,一看就明,通用,拷去即用): 可同时保 ...

  6. Hadoop YARN介绍

    YARN产生背景 MRv1的局限 YARN是在MRv1基础上演化而来的,它克服了MRv1中的各种局限性.在正式介绍YARN之前,先了解下MRv1的一些局限性,主要有以下几个方面: 扩展性差.在MRv1 ...

  7. 开发团队在TFS中使用Git Repository (一)

    在研发团队中,代码版本管理是最为基础的必要工具.个人使用过的版本管理工具有SVN.VSS.ClearCase.TFS.Git,从团队的角度和使用角度来说,个人倾向于与使用TFS作为团队的基础工具.首先 ...

  8. NET仿微信Oauth2.0

    这个文章先说一说Oauth2.0的原理,再到应用场景,最后才是代码实现,这样才学会最终的思想,并在应用场景使用,所谓实践出真理. 1,Oauth2.0的原理 OAuth是一个关于授权(authoriz ...

  9. pb_ds(平板电视)整理

    有人说BZOJ3040用普通的<queue>中priority_queue搞dijkstra过不了. 我只想说你们的djk可能写的太丑了. 先上代码 #include<iostrea ...

  10. smoke.js是一款基于HTML5 Canvas的逼真烟雾特效js插件。通过该js插件,可以非常轻松的在页面中制作出各种烟雾效果。

    Smoke.js 是一个浏览器默认警告系统的JavaScript替代品,如果你想要跨浏览器与平台的标准化JavaScript警告窗口,Smoke.js就是你想要的. Smoke.js是一个轻量级且灵活 ...