성준영 / webservice-practices

Go to a project
Toggle navigation Toggle navigation pinning
성준영
fca1099d 1 parent e515a55c

quiz_3

Inline Side-by-side
Showing 9 changed files with 501 additions and 0 deletions
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0' name='viewport' />
<title>Title</title>
<link rel="stylesheet" type="text/css" href="./style.css">
</head>
<body>
<h1>레드벨벳</h1>
<div class="img">
<img id="velvet-image" src="./velvet.jpg">
</div>
<ul id="content">
<li>구성원</li>
<ul id="members">
<li class="member">아이린</li>
<li class="member">슬기</li>
<li class="member">웬디</li>
<li class="member">조이</li>
<li class="member">예리</li>
</ul>
<br>
<br>
<br>
<li id="description">설명</li>
<blockquote id="description-content">
SM엔터테인먼트 소속의 5인조 걸그룹.2014년 8월에 4인조로 데뷔했으며 2015년 3월 예리가 합류해 5인조가 되었다. SM엔터테인먼트에서 2012년 4월 초 데뷔한 EXO 이후로 2년 4개월만에,
걸그룹으로서는 2009년 9월 초 f(x)가 데뷔한 이후 5년만에 데뷔했다. 그리고 데뷔 앨범은 2014년 8월 4일 발매되었다. 데뷔 무대는 2014년 8월 1일 뮤직뱅크에서 가졌다.
</blockquote>
<br>
<br>
<li>소속사 : <a href="http://www.smtown.com/">SM 엔터테이먼트</a></li>
<br>
<li>앨범</li>
<ol>
<li>디지털 싱글</li>
<ol>
<li><a href="https://namu.wiki/w/%ED%96%89%EB%B3%B5(Happiness)">행복 (Happiness)</a></li>
<li><a href="https://namu.wiki/w/Be%20Natural">Be Natural</a></li>
</ol>
<li>미니 앨범</li>
<ol>
<li><a href="https://namu.wiki/w/Ice%20Cream%20Cake">Ice Cream Cake</a></li>
<li><a href="https://namu.wiki/w/The%20Velvet">The Velvet</a></li>
<li><a href="https://namu.wiki/w/Russian%20Roulette">Russian Roulette</a></li>
<li><a href="https://namu.wiki/w/Rookie">Rookie</a></li>
</ol>
<li>정규 앨범</li>
<ol>
<li><a href="https://namu.wiki/w/The%20Red">The Red</a></li>
</ol>
</ol>
</ul>
</body>
</html>
\ No newline at end of file
body {
background-color: deeppink;
}
h1 {
text-align:center;
color: #f2f2f2;
font-size: 60px;
}
blockquote {
border-left: 10px solid pink;
margin: 1.5em 10px;
padding: 0.5em 10px;
}
#content {
color: #f2f2f2;
}
#velvet-image {
width : 70%;
margin-left: 15%;
margin-right: 15%;
}
#members {
list-style:none;
margin:0;
padding:0;
}
.member {
padding: 10px 20px 10px 20px;
background-color: hotpink;
margin: 5px 10px 5px 10px;
border : 0;
float: left;
}
#description {
margin : 5px 10px 10px 0;
}
body {
background-color: whitesmoke;
}
#container {
margin: 10%;
}
#image-wrapper {
text-align: center;
margin-bottom: 30px;
}
#introduce-intro {
margin: 30px 30px 60px 30px;
text-align: center;
}
.introduce-description {
margin: 5px 0 5px 0;
}
#experiment-table {
width: 90%;
margin: 5%;
border-collapse: collapse;
border-left: 0;
border-right: 0;
}
td {
padding: 10px 5px 10px 5px;
border-left: 0;
border-right: 0;
text-align: center;
}
.left-header {
background-color: whitesmoke;
}
th {
padding: 10px 5px 10px 5px;
border-left: 0;
border-right: 0;
background-color: gainsboro;
}
.maintitle {
margin: 0 0 0 0;
padding : 10px;
color:white;
background-color: #404040;
width: 100%;
position: fixed;
bottom: 0;
left: 0;
text-align: center;
}
.subtitle {
color: #404040;
}
li {
margin: 5px 0 5px 0;
}
a {
text-decoration: none;
font-weight: bold;
}
a:hover, a:visited {
color: indianred;
}
div {
font-size: 18px;
}
\ No newline at end of file
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>성준영 소개페이지</title>
<link rel="stylesheet" type="text/css" href="./2012104095.css">
</head>
<body>
<div id="container">
<div id="image-wrapper">
<img id="introduce-image" src="profileImage.png"/>
</div>
<div id="introduce-intro">
<h1 class="maintitle">성준영 소개페이지</h1>
<div class="introduce-description"> 경희대학교 컴퓨터 공학과를 재학중인 평범한 개발자입니다.</div>
<div class="introduce-description">주로 백엔드 개발에 관심이 있다고는 하지만 사실은 프론트엔드도 많이 궁금합니다.</div>
</div>
<div id="introduce-content">
<h2 class="subtitle">이름</h2>
<ul>
<li>
성준영
</li>
</ul>
<h2 class="subtitle">경력</h2>
<ol>
<li>경희대학교 컴퓨터공학과 - 2012.3 ~ NOW</li>
<li>노마드스타 서버개발 인턴 - 2016.8 ~ 2017.3</li>
</ol>
<h2 class="subtitle">발표</h2>
<ol>
<li>경희대학교 주최 소프트콘 - <a href="http://www.slideshare.net/SungJunyoung/ss-69345868">서버의 ㅅ 자도 몰랏던 스타트업 인턴의 아마존 웹
서비스
서버 이전기</a></li>
<li>네이버 D2 Campus Seminar- <a href="https://www.slideshare.net/deview/ss-72527503">텀 프로젝트에서 제품 프로젝트로</a>
</li>
</ol>
<h2 class="subtitle">경험</h2>
<table border="1px" id="experiment-table">
<tr>
<th><b>구분</b></th>
<th><b>경험</b></th>
<th><b>경험정도</b></th>
</tr>
<tr>
<th class="left-header" rowspan="5">AWS</th>
<td>EC2</td>
<td rowspan="5">Medium Level</td>
</tr>
<tr>
<td>S3</td>
</tr>
<tr>
<td>RDS</td>
</tr>
<tr>
<td>dynamodb</td>
</tr>
<tr>
<td>lambda</td>
</tr>
<tr>
<th class="left-header">PHP</th>
<td>Codeigniter</td>
<td>Low Level</td>
</tr>
<tr>
<th class="left-header" rowspan="2">Javascrpt</th>
<td>Frontend React.js</td>
<td rowspan="2">Medium Level</td>
</tr>
<tr>
<td>Backend Node.js</td>
</tr>
<tr>
<th class="left-header">Java</th>
<td>Spring</td>
<td>Medium Level</td>
</tr>
</table>
</div>
</div>
</body>
</html>
\ No newline at end of file
body {
background-color: whitesmoke;
}
#container {
margin: 10%;
}
#image-wrapper {
text-align: center;
margin-bottom: 30px;
}
#introduce-image {
width: 300px;
height: 300px;
}
#introduce-intro {
margin: 30px 30px 60px 30px;
text-align: center;
}
.introduce-description {
margin: 5px 0 5px 0;
}
#experiment-table {
width: 90%;
margin: 5%;
border-collapse: collapse;
border-left: 0;
border-right: 0;
}
td {
padding: 10px 5px 10px 5px;
border-left: 0;
border-right: 0;
text-align: center;
}
.left-header {
background-color: whitesmoke;
}
th {
padding: 10px 5px 10px 5px;
border-left: 0;
border-right: 0;
background-color: gainsboro;
}
.maintitle {
margin: 0 0 0 0;
padding: 10px;
color: white;
background-color: #404040;
width: 100%;
position: fixed;
bottom: 0;
left: 0;
text-align: center;
}
.subtitle {
color: #404040;
}
li {
margin: 5px 0 5px 0;
}
a {
text-decoration: none;
font-weight: bold;
}
a:hover, a:visited {
color: indianred;
}
div {
font-size: 18px;
}
/*모바일*/
@media screen and (max-width: 768px) {
#introduce-image {
width: 40%;
height: 40%;
}
div {
font-size: 14px;
}
h2 {
font-size: 18px;
}
li {
margin: 2px 0 2px 0;
}
#container {
margin: 3% 3% 10% 3%;
}
th {
padding: 5px 2px 5px 2px;
border-left: 0;
border-right: 0;
background-color: gainsboro;
}
td {
padding: 5px 2px 5px 2px;
border-left: 0;
border-right: 0;
text-align: center;
}
a:hover, a:visited {
color: dodgerblue;
}
.maintitle {
margin: 0 0 0 0;
padding: 5px;
font-size: 16px;
width: 100%;
position: fixed;
bottom: 0;
left: 0;
text-align: center;
}
}
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>성준영 소개페이지</title>
<link rel="stylesheet" type="text/css" href="./2012104095.css">
</head>
<body>
<div id="container">
<div id="image-wrapper">
<img id="introduce-image" src="profileImage.png"/>
</div>
<div id="introduce-intro">
<h1 class="maintitle">성준영 소개페이지</h1>
<div class="introduce-description"> 경희대학교 컴퓨터 공학과를 재학중인 평범한 개발자입니다.</div>
<div class="introduce-description">주로 백엔드 개발에 관심이 있다고는 하지만 사실은 프론트엔드도 많이 궁금합니다.</div>
</div>
<div id="introduce-content">
<h2 class="subtitle">이름</h2>
<ul>
<li>
성준영
</li>
</ul>
<h2 class="subtitle">경력</h2>
<ol>
<li>경희대학교 컴퓨터공학과 - 2012.3 ~ NOW</li>
<li>노마드스타 서버개발 인턴 - 2016.8 ~ 2017.3</li>
</ol>
<h2 class="subtitle">발표</h2>
<ol>
<li>경희대학교 주최 소프트콘 - <a href="http://www.slideshare.net/SungJunyoung/ss-69345868">서버의 ㅅ 자도 몰랏던 스타트업 인턴의 아마존 웹
서비스
서버 이전기</a></li>
<li>네이버 D2 Campus Seminar- <a href="https://www.slideshare.net/deview/ss-72527503">텀 프로젝트에서 제품 프로젝트로</a>
</li>
</ol>
<h2 class="subtitle">경험</h2>
<table border="1px" id="experiment-table">
<tr>
<th><b>구분</b></th>
<th><b>경험</b></th>
<th><b>경험정도</b></th>
</tr>
<tr>
<th class="left-header" rowspan="5">AWS</th>
<td>EC2</td>
<td rowspan="5">Medium Level</td>
</tr>
<tr>
<td>S3</td>
</tr>
<tr>
<td>RDS</td>
</tr>
<tr>
<td>dynamodb</td>
</tr>
<tr>
<td>lambda</td>
</tr>
<tr>
<th class="left-header">PHP</th>
<td>Codeigniter</td>
<td>Low Level</td>
</tr>
<tr>
<th class="left-header" rowspan="2">Javascrpt</th>
<td>Frontend React.js</td>
<td rowspan="2">Medium Level</td>
</tr>
<tr>
<td>Backend Node.js</td>
</tr>
<tr>
<th class="left-header">Java</th>
<td>Spring</td>
<td>Medium Level</td>
</tr>
</table>
</div>
</div>
</body>
</html>
\ No newline at end of file