* 겪고 있는 문제 상황을 최대한 자세하게 작성해주세요.
* 문제 해결을 위해 어떤 시도를 해보았는지 구체적으로 함께 알려주세요.
안녕하세요 1주차 배운 부분을 연습하고 있는데 안되는 부분이 있어 여쭤봅니다
1) 폰트 적용이 될 때가 있고 안될 때가 있는데 왜 그럴까요? 구글폰트에서 가져왔는데 적용 가능한 폰트가 따로 있는걸까요?
아래 첨부드린 부분에서는 적용한 폰트가 안뜨고 이 전에 적용했던 폰트로 나옵니다
2) 카드를 첨부했는데 이미지 부분에 넣을 수 있는 이미지는 어떤걸까요?
블로그 프로필 사진은 적용이 되는데 블로그 본문에 있는 사진은 적용이 안됩니다
감사합니다
작성한 코드 및 에러 메세지
<!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">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js"
integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM"
crossorigin="anonymous"></script>
<title>봄 겨울 사진 페이지</title>
<style>
@import url('https://fonts.googleapis.com/css2?family=Cute+Font&family=Jua&display=swap');
* {
font-family: 'Cute Font', cursive;
font-family: 'Jua', sans-serif;
}
.title {
background-color: #fcd7a2;
width: 100%;
height: 250px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
color: #a51e22;
font-size: 10px;
}
.image {
margin: 20px 15px 10px 0px;
width: 20%
}
.imagegroup {
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
}
</style>
</head>
<body>
<div class="title">
<h1>봄 겨울 사진 모음집</h1>
</div>
<div class="imagegroup">
<div class="image">
class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title">겨울이</h5>
<p class="card-text">애들 증멍사진 찍으러 갔을 때 요란스럽던 겨울이 겨우 건진 단독샷</p>
<!-- <p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p> -->
</div>
</div>
<div class="image">
class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title">겨울이</h5>
<p class="card-text">애들 증멍사진 찍으러 갔을 때 요란스럽던 겨울이 겨우 건진 단독샷</p>
<!-- <p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p> -->
</div>
</div>
<div class="image">
class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title">겨울이</h5>
<p class="card-text">애들 증멍사진 찍으러 갔을 때 요란스럽던 겨울이 겨우 건진 단독샷</p>
<!-- <p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p> -->
</div>
</div>
<div class="image">
class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title">겨울이</h5>
<p class="card-text">애들 증멍사진 찍으러 갔을 때 요란스럽던 겨울이 겨우 건진 단독샷</p>
<!-- <p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p> -->
</div>
</div>
</div>
</body>
</html>
