728x90
반응형
03_shadow.html
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>요안도라</title>
<style>
@import "../css/03_shadow.css";
</style>
</head>
<body>
<h1>Joandora</h1>
<h1 class="shadow1">Joandora</h1>
<h1 class="shadow2">Joandora</h1>
<h1 class="shadow3">Joandora</h1>
</body>
</html>
03_shadow.css
@CHARSET "UTF-8";
body{
font-family: Arial;
background: #808080;
}
h1{
font-size:5em;
color: white;
}
.shadow1{
text-shadow:1px 1px 3pxc #000;
}
.shadow2{
color: black;
text-shadow: 3px -3px 5px #fff;
}
.shadow3{
color: #000;
text-shadow:
0 0 4px #ccc,
0 -5px 4px #ff3,
2px -10px 6px #fd3,
-2px -15px 11px #f80,
2px -19px 18px #f20;
}
728x90
반응형
'WEB > CSS' 카테고리의 다른 글
| [CSS] ch02-05. decoration (0) | 2017.08.23 |
|---|---|
| [CSS] ch02-04.overflow (0) | 2017.08.23 |
| [CSS] ch02-02. align (정렬) (0) | 2017.08.23 |
| [CSS] ch02-01. font (폰트) (0) | 2017.08.23 |
| [CSS] ch01-11. navigation (0) | 2017.08.23 |