Skip to content
Snippets Groups Projects
Commit 76593f97 authored by donghyun lee's avatar donghyun lee
Browse files

update index.html and style.css

parent 2ed59503
No related branches found
No related tags found
No related merge requests found
Pipeline #5801 passed
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8" />
<meta name="generator" content="GitLab Pages"> <meta name="generator" content="GitLab Pages" />
<title>Plain HTML site using GitLab Pages</title> <title>Pratcial Programming part 3</title>
<link rel="stylesheet" href="style.css"> <link rel="stylesheet" href="style.css" />
</head> </head>
<body> <body>
<div class="navbar"> <div class="navbar">
<a href="https://pages.gitlab.io/plain-html/">Plain HTML Example</a> <a href="https://pages.gitlab.io/plain-html/">수업 동료 웹페이지 링크</a>
<a href="https://gitlab.com/pages/plain-html/">Repository</a> <a href="https://gitlab.com/pages/plain-html/">Repository</a>
<a href="https://gitlab.com/pages/">Other Examples</a> <a href="https://gitlab.com/pages/">Other Examples</a>
</div> </div>
<div class="intro">
<h1>
안녕하세요!!! 요즘 제가 많이 듣고 있는 노래들을 소개해보고자 합니다
</h1>
</div>
<p id="p-text-style">
많이들 아시는 분들도 있을 수도 있고, 제 취향이 다를 수도 있으니
감안해주시면 감사하겠습니다!
</p>
<h4>
제가 소개하고자 하는 노래는 간단하게 5개 정도 되겠고 해당 앨범의
표지들입니다. 하나의 앨범 안에 여러 곡이 담기기도 했습니다.
</h4>
<div class="img-box">
<img
src="https://images.genius.com/38160be65eed2b190601cbe495643c49.999x999x1.jpg"
/>
<img
src="https://i.discogs.com/ERxiK-EpzmCPmQS1gjIc8Kc72LENcxzhT7uPbARYzUI/rs:fit/g:sm/q:90/h:600/w:585/czM6Ly9kaXNjb2dz/LWRhdGFiYXNlLWlt/YWdlcy9SLTE2MTcy/Mjc0LTE2MDQ5NTM1/MjItNTY1Mi5qcGVn.jpeg"
/>
<img
src="https://image.bugsm.co.kr/album/images/200/204481/20448106.jpg?version=20230321003003.0"
/>
</div>
<div class="text-box">
<ul>
<h3>왼쪽에서부터 순서대로 진행되겠습니다.</h3>
<li>첫 번째 앨범 제목 : "130 mood : TRBL"</li>
<li>두 번째 앨범 제목 : "Stuck with U"</li>
<li>세 번째 앨범 제목 : "Between Sat & Sun"</li>
</ul>
<p>첫 번째 앨범에는 2곡이 있습니다.</p>
<ol type="1">
<li>1번째 노래 : Dean의 "what 2 do"</ll>
<li>2번째 노래 : Dean의 "D"</ll>
<p>해당 노래들의 소개로는 Dean이라는 힙합 뮤지션의 노래로 감성적인 힙합을 들려줍니다. 개코와 크러쉬라는 힙합 뮤지션이 피쳐링을 했습니다.</p>
</ol>
<h1>Hello World!!!! </h1>
<p> <p>두 번째 앨범에는 1곡이 있습니다.</p>
This is a simple plain-HTML website on GitLab Pages, without any fancy static site generator. <ol type="1">
</p> <li>Ariana grande, Justin Bieber의 "stuck with you"</li>
<h1> ????</h1> <p>해당 노래들의 소개로는 저스틴 비버와 아리아나 그란데의 외국 팝 뮤지션들의 콜라보 노래로 서정적인 팝 노래로 이것 또한 감성적입니다.</p>
</ol>
<p>세 번째 앨범에는 2곡이 있습니다.</p>
<ol type="1">
<li>1번째 노래 : toil 의 "검정색 하트"</ll>
<li>2번째 노래 : toil의 "다시 걸을 때"</ll>
<p>해당 노래들의 소개로는 Toil이라는 힙합 프로듀서 노래로 여러 힙합 뮤지션들의 피쳐링으로 toil이라는 프로듀서 특유의 감성이 담겨져 있는 곡들입니다.</p>
</ol>
</div>
</body> </body>
</html> </html>
...@@ -5,13 +5,41 @@ body { ...@@ -5,13 +5,41 @@ body {
} }
.navbar { .navbar {
background-color: #313236; background-color: aqua;
border-radius: 2px; border-radius: 2px;
max-width: 800px;
display: flex;
justify-content: center;
}
.intro > h1 {
background-color: aqua;
width: 870px;
}
#p-text-style {
font-size: 20px;
font-family: "Times New Roman", Times, serif;
font-weight: bold;
background-color: aquamarine;
width: 860px;
}
.text-box > p {
font-size: 30px;
font-weight: bold;
font-family: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif;
}
.text-box > ul > h3 {
background-color: aquamarine;
width: 300px;
}
.text-box > ul > li {
font-size: 20px;
} }
.navbar a { .navbar a {
color: #aaa; color: black;
display: inline-block; display: inline-block;
font-size: 15px; font-size: 15px;
padding: 10px; padding: 10px;
...@@ -21,4 +49,12 @@ body { ...@@ -21,4 +49,12 @@ body {
.navbar a:hover { .navbar a:hover {
color: #ffffff; color: #ffffff;
} }
.img-box {
display: flex;
justify-content: center;
}
.img-box > img {
width: 300px;
height: 300px;
padding: 10px;
}
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment