웹 개발 - 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>
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
Vue.js Transition 개요Vue.js의 Transition 기능을 요약합니다. (초기초 학습 기록) 1. transition 태그로 둘러싸기 트랜지션을 적용하고 싶은 범위를 transition 태그로 둘러싸, 컴퍼넌트를 작성. 이 컴퍼넌트내...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.