CSS радиальный градиент как фон наложения модов, как у Apple - PullRequest
Новая
       6

CSS радиальный градиент как фон наложения модов, как у Apple

1 голос
/ 26 февраля 2011

Я не мог понять это правильно. Я хочу, чтобы наложение по радиальному градиенту было похоже на Apple, но ничего, что я делал, не казалось мне близким. Я бы хотел, чтобы центральный круг имел радиус 25%, но согласился бы на радиус 350px.

1 Ответ

0 голосов
/ 14 августа 2011

Они делают это так, но я видел новые версии пользователя <canvas>. Обратите внимание, что для IE или Opera вам понадобится прозрачный png (не включенный в код CSS ниже)

HTML: 

<html>
<head>
    <link rel="stylesheet" href="gogo.css" type="text/css" media="screen" title="no title" charset="utf-8">
</head>
<body class=" bg">
<div class="radialbg">
HEELO WORLD
</div>
</body>
</html>

CSS: 

body {
    margin: 0;
    padding: 0;
}

.bg {
    background: url(pattern.jpeg) repeat;
}

.radialbg {
    background: transparent -webkit-gradient(radial, center center, 50, center center, 460, from(transparent), to(#000));
    background: -moz-radial-gradient(circle, transparent, #000);
    width: 100%;
    height: 100%;
}
...