메뉴 건너뛰기

조회 수 67 댓글 1

예제 8-2의 코드를 실행후, 스타일변경을 클릭시 "문장입니다"가 왜 "이것은"의 오른쪽에 출력되지않고 

"이것은"의 아래쪽에 출력되는건가요?

?
  • ?
    관리자 2019.08.15 00:10
    원래 <span> 태그로는 인라인 태그이므로 display 속성이 자동으로 inline 입니다.
    그래서 <span> 태그로 출력되는 것은 항상 다른 요소들과 나란히 출력되지요.
    그런데 change() 함수에서 다음과 같이 <span> 태그의 DOM 객체 span의 display 속성을 "block" 으로 바꾸었습니다.
    그러므로 이 이후부터 블록 박스가 되고, 블록 박스의 특성상 높이와 너비의 조절이 가능하며 독립된 한 줄의 공간을 차지합니다.
    span.style.display = "block"; // 블록 박스로 변경

    그래서 아래에 독립적으로 한 줄로 출력됩니다.
    display 스타일 속성에 관해서는 5장 초반부를 살펴보세요

QnA

공부하면서 궁금했던 것을 질문해보세요.

List of Articles
번호 제목 글쓴이 날짜 조회 수
공지 읽어주세요! 연습문제 및 실습문제 정답 공개에 관한 공지입니다. file 관리자 2017.06.20 18274
383 7장 10번문제 1 학섕 2017.07.12 1868
382 자바스크립트의 컴파일오류 2 1234 2018.12.22 1843
381 61 page 실습문제 1번 오류찾기 2 궁금이 2020.02.15 1757
380 7장에 실습문제 4번 질문 1 asd123 2017.11.05 1634
379 실습문제 3장 2번, 4장 8번 질문 다시 올려요. littlelion 2018.04.20 1586
378 5장 연습문제 질문 1 5장 연습문제 질문 2019.04.05 1508
377 실습문제 7장 2번 질문있습니다 1 jobjob 2017.04.04 1458
376 8장 연습문제 8번 5 은성 2017.04.05 1361
375 3장의 실습문제 1 file minju0508 2017.04.02 1334
374 2장 이론문제 3번 1 알고싶어요 2021.03.14 1332
373 7장 이론문제 3번 이의제기 합니다. 3 file 혁999 2017.12.10 1279
372 7장에 연습문제에 있는 실습문제 질문 1 student 2017.05.07 1261
371 9장 오픈챌린지 답이 너무 궁금합니다. 1 범이 2017.05.10 1253
370 3장 open challenge 질문해봅니다 6 진혁 2018.01.30 1247
369 9장 실습문제 10번 2 왜죠 ㅠㅠ 2021.01.24 1204
368 9장 실습문제 4번 3 은성 2017.04.06 1172
367 명품 html5+ css3+ javascript 웹 프로그래밍 수정판 문제 실행 오류 문의 1 file mikael 2021.04.14 1159
366 10장 실습문제5번 질문입니다, 1 asdfdef 2019.08.30 1154
365 8장 OPEN Challlenge 질문 있습니다. 1 컴퓨터공학13 2018.05.18 1150
364 9장 2번 질문있습니다. 웹프로그래밍 2017.05.28 1136
목록
Board Pagination Prev 1 2 3 4 5 6 7 8 9 10 ... 21 Next
/ 21
위로