웹 개발 - html와 css 개발 실례 - 학습 노트 3
19826 단어 학습 기록
예:
/span>html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>titltitle>
head>
<link rel="stylesheet" href="fonts/latofonts.css"/>
<style>
body{
padding: 0;
margin: 0;
}
div,input,textarea {
Box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}
.myDiv{
width:1440px;
height:827px;
background-color: #ffffff;
padding:0px auto 0px;
position: absolute;
}
.my_1_Div{
width:1030px;
height:537px;
background-color: #f9f9f9;
margin-left: auto;
margin-right: auto;
margin-top: 14px;
}
.topDiv{
width:100%;
height:83px;
text-align:center;
}
.des1Div{
margin-top:23px;
}
.bottomDiv{
width:610px;
height:426px;
margin-left: 210px;
background-color: #ffffff;
padding-left: 35px;
}
.des2Div{
font-size: 20px;
color: #22a2a1;
font-family: LatoWebBlack;
letter-spacing:1px;
padding-top: 39px;
}
.des3Div{
font-size: 17px;
color: #13243f;
font-family: LatoWebSemibold;
line-height: 23px;
margin-top: 16px;
}
.des4Div{
font-size: 17px;
color: #13243f;
font-family: LatoWebSemibold;
line-height: 23px;
margin-top: 9px;
max-width: 538px;
}
.des5Div{
font-size: 48px;
color: #13243f;
font-family: LatoWebSemibold;
margin: 32px 221px 32px 195px;
}
.des6Div{
font-size:17px;
color: #13243f;
font-family: LatoWebSemibold;
max-width: 538px;
line-height: 23px;
margin-bottom: 19px;
}
.des7Div{
color: #219290;
font-family: LatoWebBlack;
}
.des8Div{
font-size:17px;
color: #13243f;
font-family: LatoWebSemibold;
margin-bottom: 2px;
}
.des9Div{
font-size:17px;
color: #13243f;
font-family: LatoWebSemibold;
}
style>
<body>
<div class = "myDiv">
<div class="my_1_Div">
<div class = "topDiv">
<img class="des1Div" src="http://image.png">
div>
<div class="bottomDiv">
<div class="des2Div">
aaaaaaaaaaaaaaaaaaaa
div>
<div class="des3Div">
bbbbbbbbbbbbbbbbbbbbbbbbb
div>
<div class="des4Div">
ccccccccccccccccccccccccc
div>
<div class="des5Div">
ddddddddddddddddddddddd
div>
<div class="des6Div">
eeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeee
<span class="des7Div">
eeeeeeeeeeeeeeeeeee
span>
div>
<div class="des8Div">
fffffffffffffffffffffff
div>
<div class="des9Div">
gggggggggggggggggggggggggggggg
div>
div>
div>
div>
div>
body>
html>좋은 웹페이지 즐겨찾기
