border-radius:100px / 10px;中这个除法是如何使用的-慕课网

首页课程实战体系课手记专栏慕课教程

border-radius:100px / 10px;中这个除法是如何使用的

来源：7-7 CSS3选择器 ::before和::after

魔法师蚂蚱

2015-02-05 14:37

1234567891230123456

写回答关注

5回答

有一件

2015-02-05 19:39:48

已采纳

上下部边弧度直径100的幅度，左右以10的弧度，如果相同，就是圆形的角

1 2

魔法师蚂蚱

非常感谢！

2015-02-06 09:49:03

共 1 条回复 >
lzszone3203638

2018-05-26 00:18:31

3楼是对的..一楼的说法至少是把两条轴代表的轴搞反了,至少...
弧度还要看他对弧度的定义,
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<style>
.rounded {
width: 600px;
height: 200px;
background-color: yellow;
position: fixed;
left: 0;
top: 0;
border-style: dashed;
border-radius: 150px / 100px
}

.r2 {
width: 300px;
background-color: rgba(173, 32, 32, 0.212);
}

.r3 {
background-color: rgba(0, 0, 10, 0.5);
left: 300px;
}
</style>
<title>border-radius</title>
</head>
<body>
<p class="rounded">Rounded corners are groovy!</p>
<p class="rounded r2"></p>
<p class="rounded r2 r3"></p>
</body>
</html>

1 0

lzszon...

代码没写好看不太出来证明但是 a / b 中, a代表椭圆长轴的一半, b代表短轴的一半

2018-05-26 00:28:21

共 1 条回复 >
安静的学者

2017-08-14 16:46:35

一楼和三楼说的正好相反啊，谁能给个准确点的

0 0
ThinkSummer

2015-04-03 16:28:27

感觉css和html难学，非常费脑子。可能是因为他们不是编程语言吧，不严谨，没有绝对的规律性，有的时候要靠死记硬背。

1 2

慕粉1569

你是过来搞笑的吗

2016-08-19 10:18:18

共 1 条回复 >
赫岚轩

2015-04-03 11:12:57

border-radius的含义是：圆角.
border-radius是一种缩写方法.如果“/”前后的值都存在,那么“/”前面的值设置其水平半径,“/”后面值设置其垂直半径.

1 2

慕仔2685...

是不是椭圆的ab轴呢？

2015-09-28 00:54:05

共 1 条回复 >