예제 8-2의 코드를 실행후, 스타일변경을 클릭시 "문장입니다"가 왜 "이것은"의 오른쪽에 출력되지않고
"이것은"의 아래쪽에 출력되는건가요?
예제 8-2의 코드를 실행후, 스타일변경을 클릭시 "문장입니다"가 왜 "이것은"의 오른쪽에 출력되지않고
"이것은"의 아래쪽에 출력되는건가요?
번호 | 제목 | 글쓴이 | 날짜 | 조회 수 |
---|---|---|---|---|
공지 | 읽어주세요! 연습문제 및 실습문제 정답 공개에 관한 공지입니다. | 관리자 | 2017.06.21 | 18173 |
382 | 13장 실습문제 5번 질문입니다. 3 | 웹린 | 2022.12.04 | 111 |
381 | 10장 연습문제 10번 질문입니다. 2 | 웹린 | 2022.11.03 | 158 |
380 | webgl 2차원. 1 | 궁금해요 | 2022.10.10 | 131 |
379 | 6장 9-2번 이론문제(개정판) 1 | 궁금해요 | 2022.09.10 | 157 |
378 | 연습문제 3장 2번 질문합니다! 1 | KHE | 2022.09.08 | 152 |
377 | 4장 9번 이론문제 2 | 궁금해요 | 2022.09.07 | 114 |
376 | [개정판] p.357 sibling 에 대한 설명 및 그림 8-7 1 | 질문 | 2022.09.02 | 59 |
375 | target프로퍼티 질문(페이지 428쪽) 2 | 한성이 | 2022.08.15 | 47 |
374 | 스타일 시트 객체 2 | 한성이 | 2022.08.09 | 32 |
373 | css3의 프로퍼티와 7장 객체의 프로퍼티 1 | 한성이 | 2022.08.07 | 38 |
372 | 9장 6번 실습문제 2 | 궁금해요 | 2022.07.24 | 123 |
371 | 예제 8-9(373p) 1 | 열공이 | 2022.05.29 | 87 |
370 | timerID값이 null인 이유 1 | 열공이 | 2022.05.26 | 598 |
369 | length 프로퍼티 2 | 열공이 | 2022.05.21 | 59 |
368 | 9장 실습문제3번 2 | 열공이 | 2022.05.17 | 192 |
367 | 5장 오픈챌린지 관련 | 시급함 | 2022.04.16 | 197 |
366 | 교제 254페이지 1 | 쿠웨이트 | 2022.04.12 | 84 |
365 | 5장 실습문제 8번 2 | 쿠웨이트 | 2022.04.12 | 121 |
364 | 5장 실습문제 10번 1 | 쿠웨이트 | 2022.04.12 | 107 |
363 | 이미지파일 6 | 스물다섯 | 2022.04.08 | 106 |
그래서 <span> 태그로 출력되는 것은 항상 다른 요소들과 나란히 출력되지요.
그런데 change() 함수에서 다음과 같이 <span> 태그의 DOM 객체 span의 display 속성을 "block" 으로 바꾸었습니다.
그러므로 이 이후부터 블록 박스가 되고, 블록 박스의 특성상 높이와 너비의 조절이 가능하며 독립된 한 줄의 공간을 차지합니다.
span.style.display = "block"; // 블록 박스로 변경
그래서 아래에 독립적으로 한 줄로 출력됩니다.
display 스타일 속성에 관해서는 5장 초반부를 살펴보세요