CSS Circle border - PullRequest
       26

CSS Circle border

3 голосов
/ 01 декабря 2010
<!doctype html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head>
        <title>1</title>
        <style type="text/css">
body{margin:100px;}
#x
{
    position:relative;
    width:300px;
    height:360px;
    background-color:#07284a;
    -moz-border-radius: 30px;
    -webkit-border-radius:30px;
    -khtml-border-radius:30px;
    border-radius:30px;
    border:1px solid #37629B;
}
#f
{
    background-color:#07284a;
    width:126px;
    height:126px;
    position:absolute;
    right:-63px;
    top:-63px;
    -moz-border-radius: 63px;
    -webkit-border-radius:63px;
    -khtml-border-radius:63px;
    border-radius:63px;
    border:1px solid red;
}
        </style>
    </head>
<body>
<div id="x">
    <div id="f"></div>
</div>

Внутри блока "x" показана красная граница круга ... Как я могу удалить 25% границ от круга?Извините за плохой английский

ДОБАВЛЕНО

http://www.flickr.com/photos/26325973@N02/5223999393/

1 Ответ

7 голосов
/ 01 декабря 2010

Полагаю, вы хотите удалить нижнюю левую четверть границы, чтобы она совпала с большим прямоугольником.Вы можете сделать это, удалив нижнюю границу и повернув ее на 45 градусов, чтобы нижняя часть стала левой нижней:

...