-
Notifications
You must be signed in to change notification settings - Fork 83
/
Copy path81b_bgposition.html
42 lines (37 loc) · 1.52 KB
/
81b_bgposition.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
<!DOCTYPE HTML>
<html>
<head>
<style>
head, style {display: block;}
[contenteditable] {-webkit-user-modify: read-write-plaintext-only;}
style:first-of-type {visibility:hidden;}
style:last-of-type {padding: 20px; font-size: 1.5em; white-space: pre; font-family: monospace; white-space:pre; border-radius: 10px; border: 3px solid #aaa; background-color:#dedede; margin: 20px auto; width: 80%; font-family:"Courier New", Courier, monospace;}
div {
background-image: -webkit-radial-gradient(50% 50%, circle closest-side, transparent 70%, #C7573A 70%,#C7573A 85%,transparent 85% );
background-image: -moz-radial-gradient(50% 50%, circle closest-side, transparent 70%, #C7573A 70%,#C7573A 85%,transparent 85% );
background-image: -ms-radial-gradient(50% 50%, circle closest-side, transparent 70%, #C7573A 70%,#C7573A 85%,transparent 85% );
background-image: -o-radial-gradient(50% 50%, circle closest-side, transparent 70%, #C7573A 70%,#C7573A 85%,transparent 85% );
background-image: radial-gradient(50% 50%, circle closest-side, transparent 70%, #C7573A 70%,#C7573A 85%,transparent 85% );
background-size: 95px 95px;
background-repeat: no-repeat;
height:200px; width: 200px;
margin: auto;}
body {
height: 100%; width: 100%;
min-height: 310px;
}
</style>
<style contenteditable>
div {
border: 20px dashed goldenrod;
border-radius: 20px;
background-origin: border-box;
background-clip: border-box;
}
</style>
<title>CSS Selector Test</title>
</head>
<body>
<div></div>
</body>
</html>