오늘 배우고 실습한 것
- 이번에도 비슷하게 HTML과 CSS였다. 반복된 내용이었고, 난이도는 좀 더 높아졌지만, 솔루션이 굉장히 쉬웠던 상황이라 그리 어렵지 않았다. 이걸 한다고 해서 정말 코딩을 잘 하게 될 것인지 잘 모르겠다는 생각이 강하게 들었음ㅎㅎㅎ
코드
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>띵동코딩 - 로그인</title>
<style>
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css');
* {
font-family: "Pretendard",serif;
}
</style>
<style>
.wrap {
width:300px;
margin: 70px auto auto auto ;
padding: 80px 50px 50px 50px ;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
border: 1px solid lightgrey;
border-radius: 8px;
}
.wrap > img {
width: 90px;
height: 46px;
margin-bottom: 30px;
margin-right: auto;
}
.wrap > button {
width: 320px;
height: 60px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
background-color: rgb(255,226, 55);
border: none;
font-size: 16px;
font-weight: bold;
border-radius: 8px;
color: rgb(28,29,30);
cursor: pointer;
}
.wrap > span{
margin-top: 20px;
color: rgb(164, 166, 169);
cursor: pointer;
}
.wrap > p {
display: block;
font-size: 22px;
color: rgb(38,52,61);
margin-right: auto;
line-height: 1.5;
}
</style>
</head>
<body>
<div class="wrap">
<img src="https://ddingdong.spartacodingclub.kr/images/common/logo-tb.svg"></image>
<p>코딩 강의 고민은 그만,<br/>쉽고 부담없는<br/>온라인 코딩 학습지 </p>
<button>카카오로 1초만에 시작하기</button>
<span>이메일로 시작하기</span>
</div>
</body>
</html>- 확실히 코드를 그냥 짜보는 수준에 그치니까 실력이 느는 것 같진 않다. 파이썬이나 SQL과 같은 것들을 실제로 하면 또 다른 느낌이 들지 않을까 싶다.
Agile & Product