성준영 / webservice-practices

Go to a project
Toggle navigation Toggle navigation pinning
성준영
de2381b3 1 parent 1566f071

레드벨벳 css

Inline Side-by-side
Showing 4 changed files with 107 additions and 1 deletions
1 +<!DOCTYPE html>
2 +<html lang="en">
3 +<head>
4 + <meta charset="UTF-8">
5 + <title>Title</title>
6 +
7 + <link rel="stylesheet" type="text/css" href="./style.css">
8 +</head>
9 +<body>
10 +<h1>레드벨벳</h1>
11 +<img id="velvet-image" src="./velvet.jpg">
12 +
13 +<ul id="content">
14 + <li>구성원</li>
15 + <ul id="members">
16 + <li class="member">아이린</li>
17 + <li class="member">슬기</li>
18 + <li class="member">웬디</li>
19 + <li class="member">조이</li>
20 + <li class="member">예리</li>
21 + </ul>
22 + <br>
23 + <br>
24 + <br>
25 +
26 + <li id="description">설명</li>
27 + <blockquote id="description-content">
28 + SM엔터테인먼트 소속의 5인조 걸그룹.2014년 8월에 4인조로 데뷔했으며 2015년 3월 예리가 합류해 5인조가 되었다. SM엔터테인먼트에서 2012년 4월 초 데뷔한 EXO 이후로 2년 4개월만에,
29 + 걸그룹으로서는 2009년 9월 초 f(x)가 데뷔한 이후 5년만에 데뷔했다. 그리고 데뷔 앨범은 2014년 8월 4일 발매되었다. 데뷔 무대는 2014년 8월 1일 뮤직뱅크에서 가졌다.
30 + </blockquote>
31 + <br>
32 + <br>
33 + <li>소속사 : <a href="http://www.smtown.com/">SM 엔터테이먼트</a></li>
34 + <br>
35 + <li>앨범</li>
36 + <ol>
37 + <li>디지털 싱글</li>
38 + <ol>
39 + <li><a href="https://namu.wiki/w/%ED%96%89%EB%B3%B5(Happiness)">행복 (Happiness)</a></li>
40 + <li><a href="https://namu.wiki/w/Be%20Natural">Be Natural</a></li>
41 + </ol>
42 + <li>미니 앨범</li>
43 + <ol>
44 + <li><a href="https://namu.wiki/w/Ice%20Cream%20Cake">Ice Cream Cake</a></li>
45 + <li><a href="https://namu.wiki/w/The%20Velvet">The Velvet</a></li>
46 + <li><a href="https://namu.wiki/w/Russian%20Roulette">Russian Roulette</a></li>
47 + <li><a href="https://namu.wiki/w/Rookie">Rookie</a></li>
48 + </ol>
49 + <li>정규 앨범</li>
50 + <ol>
51 + <li><a href="https://namu.wiki/w/The%20Red">The Red</a></li>
52 + </ol>
53 +
54 + </ol>
55 +</ul>
56 +</body>
57 +</html>
...\ No newline at end of file ...\ No newline at end of file
1 +body {
2 + background-color: deeppink;
3 +
4 +}
5 +
6 +h1 {
7 + text-align:center;
8 + color: #f2f2f2;
9 + font-size: 60px;
10 +}
11 +
12 +blockquote {
13 + border-left: 10px solid pink;
14 + margin: 1.5em 10px;
15 + padding: 0.5em 10px;
16 +}
17 +
18 +#content {
19 + color: #f2f2f2;
20 +}
21 +
22 +#velvet-image {
23 + width : 70%;
24 + margin-left: 15%;
25 + margin-right: 15%;
26 +}
27 +
28 +#members {
29 + list-style:none;
30 + margin:0;
31 + padding:0;
32 +}
33 +
34 +.member {
35 + padding: 10px 20px 10px 20px;
36 + background-color: hotpink;
37 + margin: 5px 10px 5px 10px;
38 + border : 0;
39 + float: left;
40 +}
41 +
42 +#description {
43 + margin : 5px 10px 10px 0;
44 +}
...\ No newline at end of file ...\ No newline at end of file
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <html lang="ko"> 2 <html lang="ko">
3 <style> 3 <style>
4 + body {
5 + padding : 5%;
6 + }
7 +
4 table { 8 table {
5 border-collapse: collapse; 9 border-collapse: collapse;
6 - width: 100%; 10 + width: 90%;
11 +
7 } 12 }
8 13
9 th { 14 th {
......