[질문] 부트스트랩 코딩인데 제발 문제점좀 알려주세요오억!!!!!~!~!~!~!🤢🤮🤮 테이블+collapse

게시된 카테고리 개발/코딩

이렇게 테이블 아예 밖에서 창이 위로 생긴다말이야ㅠㅠ 

나는 이렇게 만들고 싶거든? 전체 테이블 안에 포함된채로 개별 테이블 밑으로 창 생기게 하고싶은데

코딩보고 뭐가 문제인지 알려주삼..ㅠㅠㅠ 왕초보라서ㅠㅠ

부트스트랩 + 서브라임 이용하고 있음

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47

table class="table table-hover">       thead>         tr>           th scope="col" class="font2">No/th>           th scope="col" class="font2">Name/th>           th scope="col" class="font2">Year/th>         /tr>       /thead>         tbody>         tr>           th scope="row" class="font3">1/th>           td class="font3" data-bs-toggle="collapse" href="#collapseExample1" role="button" aria-expanded="false" aria-controls="collapseExample">A/td>           td class="font3">2019/td>           div class="collapse" id="collapseExample1">         Some placeholder content for the collapse component. This panel is hidden by default but revealed when the user activates the relevant trigger.         /div>           /tr>           tr>           th scope="row" class="font3">2/th>           td class="font3" data-bs-toggle="collapse" href="#collapseExample2" role="button" aria-expanded="false" aria-controls="collapseExample2">tq/td>           td class="font3">Thornton/td>           div class="collapse" id="collapseExample2">         Some placeholder content for the collapse component. This panel is hidden by default but revealed when the user activates the relevant trigger.         /div>           /tr>           tr>           th scope="row" class="font3">3/th>           td colspan="2" class="font3"  data-bs-toggle="collapse" href="#collapseExample3" role="button" aria-expanded="false" aria-controls="collapseExample3">unspecified Recode/td>           div class="collapse" id="collapseExample3">         Some placeholder content for the collapse component. This panel is hidden by default but revealed when the user activates the relevant trigger.         /div>                      /tr>           /tbody>     /table> Colored by Color Scripter

cs

[익인1]

왜 태그가 다 < 가 없어??

[익인1]

그리고 테이블 안에 넣으려면 테이블 속성으로 넣어야될걸 div가 저렇게 들어가는게 아니구

[삭제한 댓글]

(본인이 직접 삭제한 댓글입니다)

[익인1]

밑익이 준 코드를 복사해서 되나 보고 거기 코드 수정하면서 흐름 익혀봥 그리고 class명이나 그런거 아무거나 쓰면 부트스트랩 쓰는 의미가 없음 ㅜㅜ

[익인2]

https://codepen.io/n3k1t/pen/OJMGgyq 여기 코드 똑같이 따라하면 되겠네

[삭제한 댓글]

(본인이 직접 삭제한 댓글입니다)

[익인2]

부트스트랩 주소도 넣었어?

[익인2]

라이브러리

[삭제한 댓글]

(본인이 직접 삭제한 댓글입니다)

[익인2]

밑에것도 헤드 안에 넣어바

[삭제한 댓글]

2에게
(본인이 직접 삭제한 댓글입니다)

[익인2]

삭제한 댓글에게
저게 부트스트랩 css 에 따라서 태그값이 달라질 수도 있엉 그래서 맞는 css를 써야 돼...... 네가 헤드 안에 넣은 cdn css랑 코드펜에 있는 부트스트랩 라이브러리랑 다를 수도 있다는 말임

[삭제한 댓글]

2에게
(본인이 직접 삭제한 댓글입니다)

[익인2]

삭제한 댓글에게
저거 코드펜에 export 있을 거야 그거 한번 다운받아 봐

[삭제한 댓글]

2에게
(본인이 직접 삭제한 댓글입니다)

[익인2]

삭제한 댓글에게
유튜브 강의 하나 보는 거 어때? 한번 처음부터 똑같이 따라해 보면 감 잡히는데
일단은 부트스트랩에 대한 이해가 좀 필요할 것 같아

[삭제한 댓글]

2에게
(본인이 직접 삭제한 댓글입니다)

[익인2]

삭제한 댓글에게
아고 ㅠ 그럴 필요 없는데 진짜

이걸로 일단 기초 개념만 잡아 봐 알아야 할 거
1. 부트스트랩이 무엇인지
2. 부트스트랩으로 뭘 할 수 있는 건지(왜 필요한가)
3. 부트스트랩의 클래스 사용법
4. div id, div class, tr id, tr class 와 같이 id와 class의 차이점

[익인2]

삭제한 댓글에게
그리고 보통 bootstrap4 나 5나 mdbootstrap 쓰는데 나는... 거기에 맞게 문서 보면서 디자인 맞춰