html
- html 파일에서 html:5 입력하면 자동으로 세팅완료
- 코드 전체 정렬 ⇧ ⌥ F (Shift + Alt + F)
- 맥북 vscode 단축키 (https://altongmon.tistory.com/1055)
css
- 이미지 넣기 : 아래와 같이 항상 세가지가 세트로 따라 다닌다.
background-image: url('https://www.ancient-origins.net/sites/default/files/field/image/Agesilaus-II-cover.jpg');
background-position: center;
background-size: cover;
- padding : auto 는 끝까지 다 밀어버림의 의미를 가지고 있음.
- 구글 폰트 적용하기
https://fonts.google.com/?subset=korean¬o.script=Kore
<style>
@import url('https://fonts.googleapis.com/css2?family=Black+Han+Sans&display=swap');
* {
font-family: 'Black Han Sans', sans-serif;
}
</style>
- Bootstrap (부트스트랩)
https://getbootstrap.com/docs/5.3/components/buttons/
<title> 아래에 bootstrap CDN 링크 추가하기
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>나만의 추억앨범</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
</head>
<body>
<button type="button" class="btn btn-primary">Primary</button>
</body>
</html>
728x90
반응형
'부트캠프 개발일지 2023-2024 > Pre-course 사전학습' 카테고리의 다른 글
| [Pre-course] 웹개발 기초 : addDoc, getDoc, Github 배포, 파이썬 (0) | 2023.10.03 |
|---|---|
| [Pre-course] 웹개발 기초 : Firebase, Database, Firestore Database (데이터 넣기, 데이터 가져오기) (0) | 2023.10.03 |
| [Pre-course] 웹개발 기초 : Client-Server, Fetch (1) | 2023.10.02 |
| [Pre-course] 웹기발 기초 : JQuery 2 (1) | 2023.10.01 |
| [Pre-course] 웹개발 기초 : JavaScript, JQuery (0) | 2023.10.01 |