border-radius几种写法的原理剖析
- border-radius:40px;
- border-radius:40px/20px;
- border-radius:40px 20px;
- border-radius:40px 20px 10px 5px;
今天主要是测试上面四种border-radius的写法。
首先是第一种。
border-radius:40px;
这里设置了一个值,所以默认4个角都显示为半径40的圆角,蓝色方框为40像素宽的正方形。所以也就是相当于圆的半径。
第二种
border-radius:40px/20px;
这里除了40px外还加了一个 /20px 这里的意思是将圆角定义为椭圆,其实正圆本来不就是椭圆的一种特殊情形吗?这种表示虽然有,但是平常用的不多。
第三种
border-radius:40px 20px;
这种和第二种写法的区别是没有 / 符号,其意义和普通的设置边距什么的是一样的。就是代表上下左右的意思。不废话直接看图。
第四种
border-radius:40px 20px 10px 5px;
第四种是为了写出顺序,从左上角顺时针到左下角,就是border-radius属性的值的设置顺序。
转载请注明:来自博客园,manfredHu
谢谢大家
border-radius几种写法的原理剖析的更多相关文章
- httpd三种MPM的原理剖析
html { font-family: sans-serif } body { margin: 0 } article,aside,details,figcaption,figure,footer,h ...
- Spark剖析-宽依赖与窄依赖、基于yarn的两种提交模式、sparkcontext原理剖析
Spark剖析-宽依赖与窄依赖.基于yarn的两种提交模式.sparkcontext原理剖析 一.宽依赖与窄依赖 二.基于yarn的两种提交模式深度剖析 2.1 Standalne-client 2. ...
- CSS3 用border写 空心三角箭头 (两种写法)
之前一直在寻找这种空心三角箭头, 终于知道了原理! 自己记录一下,顺便分享给之前跟我一样想要的撸友们~ 第一种写法 利用常见的 after伪元素 <!DOCTYPE html> <h ...
- Android编程之Listener侦听的N种写法及实现原理
写下这个题目时突然想起鲁迅笔下的孔乙已,茴香豆的几种写法,颇有些咬文嚼字的味道.虽然从事手机编程多年,但一直使用的是C和C++编程,由于安卓早期只支持JAVA开发,所以对于时下如火如荼的安卓系统,我一 ...
- ARouter原理剖析及手动实现
ARouter原理剖析及手动实现 前言 路由跳转在项目中用了一段时间了,最近对Android中的ARouter路由原理也是研究了一番,于是就给大家分享一下自己的心得体会,并教大家如何实现一款简易的路由 ...
- 基于JS实现回到页面顶部的五种写法(从实现到增强)
这篇文章主要介绍了基于JS实现回到页面顶部的五种写法(从实现到增强)的相关资料,本文介绍的非常详细,实用性也非常高,非常具有参考借鉴价值,需要的朋友可以参考下 写法 [1]锚点 使用锚点链接是一种 ...
- Android Listener侦听的N种写法
Android中,View的Listener方法,在是否使用匿名类匿名对象时,有各种不同的写法. OnClickListener和其他Listener方法一样,都是View类的接口,重载实现后就能使用 ...
- JS面向对象的几种写法
JS 中,面向对象有几种写法.归纳下,大概有下面这几种:工厂模式,构造函数模式,原型模式,构造函数与原型模式的混合使用,原型链继承,借用构造函数继承. 一.工厂模式 function person ( ...
- 【Xamarin挖墙脚系列:Xamarin.IOS机制原理剖析】
原文:[Xamarin挖墙脚系列:Xamarin.IOS机制原理剖析] [注意:]团队里总是有人反映卸载Xamarin,清理不完全.之前写过如何完全卸载清理剩余的文件.今天写了Windows下的批命令 ...
随机推荐
- [转]gdb结合coredump定位崩溃进程
[转]gdb结合coredump定位崩溃进程 http://blog.sina.com.cn/s/blog_54f82cc201013tk4.html Linux环境下经常遇到某个进程挂掉而找不到原因 ...
- 小组开发项目针对性的NABC分析
单独就我们团队开发项目——重力解锁的功能特点而言,我们解决了智能手机屏幕解锁的乏味和繁琐的特点,显得更有趣味性和独特性,更符合现代人追随时尚的潮流:我们根据个人的不同喜好和便利性来设定一些动作,利用重 ...
- 微软Hololens学院教程-Hologram 220-空间声音(Spatial sound )【本文是老版本,与最新的微软教程有出入】
这是老版本的教程,为了不耽误大家的时间,请直接看原文,本文仅供参考哦! 原文链接https://developer.microsoft.com/EN-US/WINDOWS/HOLOGRAPHIC/ho ...
- javascript学习小记(一)
大四了,课少了许多,突然之间就不知道学什么啦.整天在宿舍混着日子,很想学习就是感觉没有一点头绪,昨天看了电影激战.这种纠结的情绪让我都有点喘不上气啦!一点要找点事情干了,所以决定找个东西开始学习.那就 ...
- android开发,静音录制视频,在一般清晰度的前提下保证文件大小越小越好
public void startRecord() { mediarecorder = new MediaRecorder();// 创建mediarecorder对象 mCamera = getCa ...
- OS X 使用技巧——轻松地调整窗口大小
如果你想调整窗口大小,只需要把鼠标指针悬停在窗口边框上.当它变成双向箭头时,点击并拖动鼠标即可完成这一操作. 但在实际操作中,迅速把鼠标指针定位到边框上比较困难. 解决的办法是:在终端输入以下命令: ...
- c++ dirname() basename()
http://linux.about.com/library/cmd/blcmdl3_dirname.htm #include <iostream> #include <libgen ...
- redis.conf配置
# Redis configuration file example # Redis示例配置文件 # Note on units: when memory size is needed, it is ...
- 02.Apache FtpServer使用数据库管理用户
1.创建数据库及表 使用\apache-ftpserver-1.0.6\res\ftp-db.sql建表,内容如下: CREATE TABLE FTP_USER ( userid VARCHAR(64 ...
- ASP.NET MVC学习之视图篇(1)
一.前言 不知道还有多少读者从第一篇开始一直学习到如今,笔者也会一直坚持将ASP.NET MVC的学习完美的结束掉,然后开始写如何配合其他框架使用ASP.NET MVC的随笔.当然笔者后面的随笔如果没 ...