CV dari HTML dan CSS
Nama : Ersad Ahmad Ishlahuddin
NRP : 05111740000016
Kelas : PWEB C
Jadi beberapa minggu lalu saya mendapatkan tugas untuk membuat CV dari HTML dan CSS
setelah membaca beberapa refrensi, ini lah hasil kerja saya
Link Website : LINK
Source Code
HTML
CSS
Screenshot
Nama : Ersad Ahmad Ishlahuddin
NRP : 05111740000016
Kelas : PWEB C
Jadi beberapa minggu lalu saya mendapatkan tugas untuk membuat CV dari HTML dan CSS
setelah membaca beberapa refrensi, ini lah hasil kerja saya
Link Website : LINK
Source Code
HTML
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Curriculum Vitae</title>
<link rel="stylesheet" type="text/css" href="css.css">
</head>
<body>
<div id="page-wrap">
<div>
<img src="images/profil2.jpg" alt="Ersad Ishlahuddin" id="pic" />
<h1>Ersad Ahmad Ishlahuddin</h1>
<table id="datadir">
<tr>
<td style="font-weight: bold">NRP</td>
<td style="padding-left: 10px">: 05111740000016</td>
</tr>
<tr>
<td style="font-weight: bold">Birthday</td>
<td style="padding-left: 10px">: July 9, 1999</td>
</tr>
<tr>
<td style="font-weight: bold">Address</td>
<td style="padding-left: 10px">: ITS Dormitory I-225</td>
</tr>
<tr>
<td style="font-weight: bold">Motto</td>
<td style="padding-left: 10px">: "Everyone could improvise their respective roles"</td>
</tr>
<tr>
<td style="font-weight: bold">Hobbies</td>
<td style="padding-left: 10px">: Watching Videos, Analyze Something, Travelling</td>
</tr>
</table>
</div>
<div id="objective">
<p style="text-align: justify">
I am an experienced person in analize and observe something.
Having capability for work under pressure and in limited time.
Taciturn, but have high enthusiasm for something that attractive and unique.
Responsible, because I have to finish what I started.
</p>
</div>
<div class="clear"></div>
<div>
<dl>
<br>
<dt style="height: 280px">Education</dt>
<dd>
<h3>Islamic Elementary School 1 of Margomulyo</h3>
<p>2005-2011</p>
</dd>
<dd>
<h3>Junior High School 1 of Balen</h3>
<p>2011-2014</p>
</dd>
<dd>
<h3>Senior High School 1 of Bojonegoro</h3>
<p>2014-2017</p>
</dd>
<dd>
<h3>Sepuluh Nopember Institute Of Technology</h3>
<p><strong>Informatics Department</strong></p>
<p>2017-Present</p>
</dd>
<br>
<dt style="height: 180px">Skills</dt>
<dd>
<!-- <div style="border-bottom: 10px solid #999"></div> -->
<h3>Design and Editing</h3>
<p>Adobe Photoshop, Adobe Illustrator, Wondershare Filmora</p>
<h3>Computer Skills</h3>
<p>Microsoft productivity software (Word, Excel, Powerpoint), Windows, Linux</p>
</dd>
<dt></dt>
<dd>
<h3>Programming Language</h3>
<p>C, C++, Pascal, HTML, CSS</p>
</dd>
<br>
<dt style="height: 250px">Organization Experience</dt>
<dd>
<h3>TRY OUT SBMPTN</h3>
<p>FORBBITS 2017</p>
<h3>TC ARENA</h3>
<p>HMTC FTIf 2018</p>
<h3>SCHEMATICS NLC</h3>
<p>HMTC FTIf 2018</p>
<h3>PPU HMTC</h3>
<p>HMTC FTIf 2018</p>
</dd>
<br>
</dl>
</div>
<div>
<table id="belbel">
<tr>
<td style="width: 40%">
<a href="mailto:ersadishlahuddin@gmail.com">
<img src="images/email.png" style="width: 30px">
ersadishlahuddin@gmail.com
</a>
</td>
<td style="width: 30%">
<a>
<img src="images/wa.png" style="width: 30px">
</a>
+62822 3272 3879
</td>
<td style="width: 30%">
<a href="https://www.instagram.com/ersadishla/">
<img src="images/ig.png" style="width: 30px">
</a>
<a>
<img src="images/line.png" style="width: 30px">
</a>
<a href="https://www.facebook.com/ersadishla/">
<img src="images/fb.png" style="width: 30px">
</a>
<a href="https://www.twitter.com/ersadishla/">
<img src="images/tw.png" style="width: 30px">
</a>
ersadishla
</td>
</tr>
</table>
</div>
</div>
</body>
</html>
CSS
* {
margin: 0;
padding: 0;
}
body {
font: 16px Helvetica, Sans-Serif;
line-height: 24px;
background: url(images/noise.jpg);
}
.clear {
clear: both;
}
#page-wrap {
width: 800px;
margin: 40px auto 60px;
}
#pic {
float: right;
/*margin: 5px 0 0 0; */
}
h1 {
margin: 0 0 16px 0;
padding: 10px 0 16px 0;
font-size: 42px;
letter-spacing: -2px;
border-top: 10px solid #999;
border-bottom: 10px solid #999;
}
#datadir td{
font-size: 20px;
font-family: Helvetica, Serif;
}
h3 {
font-size: 17px;
margin: 0 0 6px 0;
position: relative;
}
p {
margin: 0 0 10px 0;
}
#objective {
width: 500px;
float: left;
}
#objective p {
font-family: Georgia, Serif;
font-style: italic;
}
dt {
font-style: italic;
font-weight: bold;
font-size: 18px;
text-align: right;
padding: 0 10px 0 0;
width: 130px;
float: left;
background-color: #999;
}
dd {
border-right: 10px solid #999;
width: 600px;
float: left;
padding-left: 50px;
}
dd.clear {
float: none;
margin: 0;
height: 15px;
}
#belbel{
width: 100%;
border-right: 10px solid #999;
border-top: 10px solid #999;
border-bottom: 10px solid #999;
padding-top: 10px;"
}
Screenshot
Komentar
Posting Komentar