一、

现在前面只写知识点,全部内容放在后面截图展示:

给元素添加圆角:

border-radius属性,他的值如果等于高的一半,将会等到一个圆形,大于一半叶然是一个圆形

radius是指半径,他求出圆在矩形上的切面。

border-radius可以设置4个方向的值。

二、

box-shadow为元素添加阴影

书写格式:

box-shadow:水平阴影的位置 垂直阴影的位置 模糊距离 颜色

例子:box-shadow:10px 20px 5px blue

css3文本效果

text-shadow(文字阴影)

这个属性可以指定水平阴影、垂直阴影、模糊的距离以及阴影的颜色。

例子:

P{text-shadow:5px 5px 5px #FF0000}

三、

CSS3字体

写法:

@font-face{font-family:自定义名字;src:url(“引入字体的路径”)}

p{font-family:你自定义的名字;}

以下是详细信息

css3圆角(还有百分比设置椭圆) 阴影 字体的更多相关文章

  1. CSS3圆角详解

    一.CSS3圆角的优点 传统的圆角生成方案,必须使用多张图片作为背景图案.CSS3的出现,使得我们再也不必浪费时间去制作这些图片了,而且还有其他多个优点: * 减少维护的工作量.图片文件的生成.更新. ...

  2. CSS3圆角详解(border-radius)

    1.CSS3圆角的优点 传统的圆角生成方案,必须使用多张图片作为背景图案.CSS3的出现,使得我们再也不必浪费时间去制作这些图片了,而且还有其他多个优点: 减少维护的工作量.图片文件的生成.更新.编写 ...

  3. 纯代码利用CSS3 圆角边框和盒子阴影 制作 iphone 手机效果

    原文:纯代码利用CSS3 圆角边框和盒子阴影 制作 iphone 手机效果 大家好,我是小强老师. 今天我们看下CSS3最为简单的两个属性. css3给我们带来了很多视觉的感受和变化,以前的图片做的事 ...

  4. 从零开始学习前端开发 — 16、CSS3圆角与阴影

    一.css3圆角: border-radius:数值+单位; 1.设置一个值:border-radius:20px; 四个方向圆角都为20px(水平半径和垂直半径相等) 2.设置两个值 border- ...

  5. css3圆角矩形、盒子阴影

    css3圆角矩形 div{ width: 200px; height: 200px; border: #f00 solid 1px; margin-bottom: 10px; } 1.设置 borde ...

  6. 【Web】CSS实现抖音风格字体效果(设置文本阴影)

    简单记录 -慕课网- 步骤一:抖音风格字体效果 案例:抖音风格的字体特效. 实现这个 需要设置 网页背景颜色 字体颜色 字体大小 文本阴影 重点介绍如何设置文本阴影 CSS的文本阴影text-shad ...

  7. CSS3圆角

    使用border-radius属性: (1): (2)但是,如果你要在四个角上一一指定,可以使用以下规则: 四个值: 第一个值为左上角,第二个值为右上角,第三个值为右下角,第四个值为左下角. 三个值: ...

  8. CSS3圆角详解第一辑

    有很多人都知道圆角怎么写,加一个border-radius就可以,但是对于用圆角的一些细节却并不是很清楚,那么我们今天就来聊一聊这个圆角.CSS3是样式表(style sheet)语言的最新版本,它的 ...

  9. css3圆角边框

    圆角边框 一.border-radius属性简介   为元素添加圆角边框,可以对元素的四个角进行圆角设置(属性不具有继承性) 二.border-radius定义方法 border-radius属性有两 ...

随机推荐

  1. Android应用的安全的攻防之战

    一.前言 在前两篇破解的文章中,我们介绍了如何使用动态调试来破解apk,一个是通过调试smali源码,一个是通过调试so代码来进行代码的跟踪破解,那么今天我们就这两篇文章的破解方法,来看看Androi ...

  2. 2016年12月27日 星期二 --出埃及记 Exodus 21:22

    2016年12月27日 星期二 --出埃及记 Exodus 21:22 "If men who are fighting hit a pregnant woman and she gives ...

  3. T-SQL语句简易入门(第一课)

    在微软官方,有一篇介绍T-SQL语句的教程,非常好理解,完全可以帮助新手入门,了解常用SQL语句的使用语法,而且又不涉及较为复杂的操作.不用安装示例数据库AdventureWorks.下面是教程里内容 ...

  4. hive的使用03

    1.hive中的四种排序 1.1 order by :对全局进行排序,只能有一个reduce select * from hive.employee order by id;

  5. 蚁群算法简介(part 1:蚁群算法之绪论)

    群算法是Marco Dorigo在1992年提出的一种优化算法,该算法受到蚂蚁搜索食物时对路径的选择策略的启示.蚁群算法作为群体智能算法的一种利用分布式的种群搜索策略来寻找目标函数的最优解.蚁群算法与 ...

  6. javaScript 验证表单提交

    <script type="text/javascript">      function $(id) {          return document.getEl ...

  7. 联想键盘 去掉fn

    这个帖子 很实用 http://iknow.lenovo.com/detail/dc_039949.html 键盘驱动下载地址:http://support1.lenovo.com.cn/lenovo ...

  8. angular中动态添加的元素绑定事件问题

    $compile http://segmentfault.com/q/1010000000726448/a-1020000000727088 接口下载问题

  9. [Docker] Docker简介

    一.简介 Docker 是一个开源的应用容器引擎,让开发者可以打包他们的应用以及依赖包到一个可移植的容器中,然后发布到任何流行的 Linux 机器上,也可以实现虚拟化.容器是完全使用沙箱机制,相互之间 ...

  10. 【burp】配置HTTPS抓包方法

    以Chrome为例,配置HTTPS抓包方法 1.获取破解版的burp,将BurpLoader.jar和burpsuite_pro_v1.5.18.jar放到一个路径下 2.在cmd里进入上述两个jar ...