본문 바로가기 메뉴 바로가기

Programmers

프로필사진
  • 글쓰기
  • 관리
  • 태그
  • 방명록
  • RSS

Programmers

검색하기 폼
  • 개발 노트 (287)
    • VUEJS (21)
    • JAVA (3)
    • Python (10)
    • HTML CSS JS (72)
    • Servlet JSP (67)
    • JDBC (19)
    • Oracle Database (21)
    • POSIX CLI (13)
    • Git (34)
    • 알고리즘 (4)
    • 개발자 취업 준비 (8)
    • 스크랩 [정보] (1)
    • 이것저것 정리 (6)
  • 방명록

Display (2)
CSS) display 수정

1) display 수정 float 속성이 추가된 요소는 display 속성의 값이 대부분 block으로 수정됨 사용법 1. float 속성 추가전 html 1 2 3 css span { width: 100px; height: 100px; margin: 10px; background: tomato; } 출력결과 2. flaot 속성 추가 후 html 1 2 3 css span { width: 100px; height: 100px; margin: 10px; background: tomato; float: left; } 출력결과 주의사항 지정값 변화값 inline block inline-block block inline-table block table-row block table-row-group block..

HTML CSS JS 2021. 8. 30. 07:31
CSS) display

1) display 요소의 박스 타입(유형)을 설정 속성 값 값 의미 기본값 block 블록 요소( 등) inline 인라인 요소( 등) inline-block 인라인-블록 요소( 등) 기타 table, table-cell, flex 등 none 요소의 박스 타입이 없음(요소가 사라짐) ※ block: 가로, 세로, 패딩, 마진 사용 가능 ※ inline: 가로, 세로, 패딩, 마진 사용 불가능, 우측으로 쌓임, 텍스트를 다루는데 특화 ※ inline-block: inline의 특성을 가지지만 가로, 세로, 패딩, 마진의 위아래를 사용 가능 display: none; 화면에서 사라짐 사용법 ※ span태그는 inline요소이기 때문에 width, height값이 안 먹혀서 아무것도 출력이 되지 않는다. ..

HTML CSS JS 2021. 8. 18. 08:55
이전 1 다음
이전 다음
공지사항

Blog is powered by Tistory / Designed by Tistory

티스토리툴바