부트스트랩 작동이 안 됩니다.
본문
부트스트랩 작동이 안 되는 것 같습니다.
사실은 됐다가 안 되는 것 같습니다.
부트스트랩 경로는 다음 사진과 같구요.
저의 사이트가 로딩될 때 이 순서로 됩니다.
큰 게 나왔다가 로딩이 완료되면 저렇게 작아집니다.
<h1>로 hello world를 써서 32point라서 원했던대로 됐다가
다시 사라집니다. ㅜㅜ
코드는 이렇구요.
코드 중에
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
저기 굵게 표시된 3.3.2를 지우면 사이트는 다시 커지는데요.
룰루랄라와 뉴뉸냐냔 부분이 3:9로 나눠지는 모습 또한 사라집니다.
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap-theme.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/jsbootstrap.min.js"></script>
<scrips src="https://ajax.googleapis.com/ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
부트스트랩이 왜 작동됐다가 안 되는 걸까요?
경로가 잘못된걸까요
아니면 부트스트랩이 잘 안깔린걸까요?
답변 2
전체적으로 잘못되었습니다.
아마도 부트스트랩 샘플의 html 헤더 내용을 통째로 붙여넣으신거같습니다.
그래서 헤더도 두번 정의 되었습니다.
필요한 부분만 뺴서 사용하시는 그누보드 스킨의 head.sub.php 파일에 포함시켜야 합니다.
기존 head.sub.php 파일을 원래대로 해놓으시고
default.css 정의된곳 아래에
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap-theme.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/jsbootstrap.min.js"></script>
이부분을 포함시키시고 상단에 meta 테그 있는 부분에
<meta name="viewport" content="width=device-width, initial-scale=1">
이부분을포함하세요.
그리고 부트스트랩을 적용하면 기존 페이지들 디자인이 전부다 깨집니다
1부터100까지 css 다시 정의해주셔야 합니다. 부트스트랩에 맞게..
화면이 다 깨져보일꺼에요.
적용된 스타일은 부트스트랩이지만 회원님의 홈페이지는 그게 아니니까요.
글로 설명하려니 참 힘드네요
붙여넣기 두번이면 끝나는건데 설명하기가 참
!-->!-->
css 중첩입니다. url 을 올려주시면 좋을텐데..
부트스트랩 css 가 로딩되고 전체적인 디자인이 해당 css 에 영향을 받다가
이후에 로딩된 테마 css 나 그누보드 내장 css 파일의 영향을 받아 다시 바뀌는 상황 같습니다.
body input h1,h2,h3....span li 등등 공통적인 css 스타일이 선언됩니다.
당연히 부트스트랩에도 있고 그누보드에도 기본적으로 선언이 되어있겠지요
어느걸 사용할지 명확히 하시고 해당 css 파일에서 삭제하셔야 합니다.