2 글 보임 - 1 에서 2 까지 (총 2 중에서)
-
글쓴이글
-
2023년 3월 6일 22:11 #71197
주태헌참가자chap3, chap4 관련 질문입니다. 처음부터 많이 막히네요. 박스그림이 안나오네요. <div class="thumbnail" style="background-image: url('https://via.placeholder.com/350')"></div> 대신 < img src="https://via.placeholder.com/600" class="w-100"> 를 넣으면 글자 위치는 틀려두 박스그림이 나오긴 나오는데 어디가 잘못된건지 못찾겠네요, 이게 막히니 다음 강의로 가지도 못하고 있습니다. 물론 강의자료 복불복 했구요 부트스트랩 버전이 문제인가 해서 5.1.3 도 해보고 5.0.2 도 해봤는데 도 마찬가지입니다.<!DOCTYPE html> <html lang="en">
<head> <meta charset="UTF-8"> <!-- boostrap 5.1.3 --> <!-- <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous"> <link href="css/main.css" rel="stylesheet"> -->
<!-- boostrap 5.0.2 --> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous"> <link href="main.css" rel="stylesheet"> <link href="upload.html" rel="stylesheet"> <link rel="shortcut icon" href="#">
<!-- jQuery--> <script src="https://code.jquery.com/jquery-3.6.3.min.js" integrity="sha256-pvPw+upLPUjgMXY0G+8O0xUf+/Im1MZjXxxgOcBQBXU=" crossorigin="anonymous"></script>
<title>Document</title>
</head>
<body>
<script src="https://www.gstatic.com/firebasejs/8.6.5/firebase-app.js"></script> <script src="https://www.gstatic.com/firebasejs/8.6.5/firebase-auth.js"></script> <script src="https://www.gstatic.com/firebasejs/8.6.5/firebase-firestore.js"></script> <script src="https://www.gstatic.com/firebasejs/8.6.5/firebase-storage.js"></script>
<script> var firebaseConfig = { apiKey: "AIzaSyCqTPp6w1ahgrnZ6lOXwSEgWzr9nQdLLDg", authDomain: "haha3-def64.firebaseapp.com", projectId: "haha3-def64", storageBucket: "haha3-def64.appspot.com", messagingSenderId: "917355834543", appId: "1:917355834543:web:f2677d4a389e54f23b385a" }; firebase.initializeApp(firebaseConfig);</script>
<!-- =index04.html======================================================== -->
<!-- chap03 --> <nav class="navbar navbar-expand-lg navbar-light bg-light"> <div class="container-fluid"> 사과carrot마켓 <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="navbarNav"> <ul class="navbar-nav"> <li class="nav-item"> Home <li class="nav-item"> Features <li class="nav-item"> Pricing <li class="nav-item"> Disabled </div> </div> </nav>
<!-- chap04-1 --> <div class="container mt-3"> <div class="product"> <div class="thumbnail" style="background-image: url('https://via.placeholder.com/350')"></div> <div class="flex-grow-1 p-4"> <h5 class="title">아기다스 신발</h5> <p class="date">2030년 1월 8일</p> <p class="price">20000원</p> <p class="float-end">?0</p> </div> </div> </div><script> // chap04-5 const db = firebase.firestore(); db.collection('product').get().then((결과)=>{ 결과.forEach((doc)=>{ console.log(doc.data()); var 템플릿 = `<div class="product"> <div class="thumbnail" style="background-image: url ('https://via.placeholder.com/350')"></div> <div class="flex-grow-1 p-4"> <h5 class="title">${doc.data().제목}</h5> <p class="date">2030년 1월 8일</p> <p class="price">20000원</p> <p class="float-end">0</p> </div> </div>`; $('.container').append(템플릿); }); }); </script><script> // chap04-4 const db = firebase.firestore(); db.collection('product').get().then((결과)=>{ 결과.forEach((doc)=>{ console.log(doc) var 템플릿 = `<div>상품임</div>`; $('.container').append(템플릿) }); }); </script><!-- =index04.html======================================================== -->
<!-- boostrap 5.1.3 --> <!-- <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script> -->
<!-- boostrap 5.0.2 --> <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>
</body>
</html>
2023년 3월 7일 09:37 #71252
codingapple키 마스터옆에 main.css에 스타일도 잘 들어있나 확인합시다 <link href="upload.html" rel="stylesheet"> 는 지웁시다
-
글쓴이글
2 글 보임 - 1 에서 2 까지 (총 2 중에서)
- 답변은 로그인 후 가능합니다.