# inline block

40개의 포스트
post-thumbnail

block / inline / inline-block

block 요소 바로 옆(좌우측)에 다른 요소를 붙여넣을 수 없다 width, height, margin, padding 속성이 모두 반영 > # inline 요소끼리 서로 한 줄에, 바로 옆에 위치할 수 있다 텐트의 크기 만큼만 공간을 차지하도록 되어 있기 때문에 width와 height 속성을 지정해도 무시 > # inline-block 요소...

2021년 2월 17일
·
0개의 댓글
post-thumbnail

[HTML/CSS] Inline⛸과 Block⬛, Float

CSS Property display inline block

2021년 2월 17일
·
0개의 댓글

[css] block, inline, inline-block

css display에서 선택가능한 block, inline, inline-block에 대한 포스팅block 속성을 가진 element는 각각의 element가 페이지의 왼쪽 끝에서 오른쪽 끝까지 너비를 가진다. 너비는 도화지 같은 개념으로, A4용지에 작은 그림을 그

2021년 1월 13일
·
0개의 댓글

CSS- inline, inline-block, block

css display 속성에는 inline, inline-block, block, none, flex 등이 있음더 많은 display 속성 값 알아보기콘텐츠 크기 만큼만 해당 콘텐츠를 감싸는 박스의 크기가 연동되어 결정됨horizontally 정렬하는 경우 주로 사용전

2021년 1월 12일
·
0개의 댓글

[TIL]display

display속성에는 inline, block, inline-block, flex, list-item 등 여러가지들이 있다.inline display다른 요소들과 같은 줄에 머무르려고 하는 성향.가로길이는 필요한 만큼만 차지하는 성향.가로세로 길이 개념 없음.텍스트(글

2021년 1월 2일
·
0개의 댓글

레이아웃 2단 구조 만드는 2가지 방법

레이아웃 2단 구조를 만드는 방법을 가장 쉽게 하는 방법에 대해서 공유해 드릴까 합니다.아래 방법은 제가 자주 쓰는 방법 입니다.자세한 설명은 코드로 애기 하겠습니다.

2020년 12월 21일
·
0개의 댓글

display

display속성이 inline으로 지정된 요소는 한줄에 다른 엘리먼트들과 나란히 배치된다ex) <span>, <a>, <em>content의 크기만큼만 공간을 차지 하기 때문에 width와 height속성을 지정해도 무시된다.margin과 paddin

2020년 12월 17일
·
0개의 댓글
post-thumbnail

inline, inline-block, block

inline 속성의 기본적인 특징은 새로운 수직 라인을 생성하지 않고 오직 입력한 정보에 필요한 만큼의 width 공간만 차지합니다.여러가지 inline html 태그들이 있지만 흔히 쓰는 것으로는 span, a, input, img 가 inline 속성을가진 태그입니

2020년 12월 16일
·
0개의 댓글
post-thumbnail

[HTML / CSS] Display 속성

레이아웃을 컨트롤할 수 있는 Display 속성. 모든 요소들은 대부분 block 아니면 inline을 Display속성 값으로 가지고 있다. block block 요소는 브라우저의 한줄을 모두 사용하며, 위에서 아래로 차곡차곡 쌓인다. inline

2020년 11월 18일
·
0개의 댓글
post-thumbnail

11.18 TIL

\-none : 띄우지 않음\-left : 왼쪽에 띄움\-right : 오른쪽에 띄움\-initial : 기본값으로 설정\-inherit : 부모 요소로부터 상속ex)img{ float: left; } \-위치 계산 시, 현재 위치에서 상대적인 offset 속성을

2020년 11월 18일
·
0개의 댓글

TIL-wecode day-3 CSS중요부분 정리

position이란 속성은 문서상에서 요소들을 배치하는 방법이다.주로 top,right,bottom,left속성이 요소들을 배치할 최종위치를 결정한다.요소를 문서의 흐름에 따라 배치한다. top,right,bottom,left와 같은 속성에 영향을 미치지 않는다.간단히

2020년 11월 18일
·
0개의 댓글
post-thumbnail

inline, block, inline-block

HTML요소는 "인라인" 요소와 "블록 레벨" 요소로 구분된다.컨텐츠의 크기만큼만 공간을 차지하고 줄바꿈을 하지 않는다.가로세로의 크기를 임의로 지정할수 없고, 그 크기는 오로지 컨텐츠에 의해서 결정된다.대표적인 inline요소로는 <span>이 있다.다른 여러

2020년 11월 17일
·
0개의 댓글
post-thumbnail

[CSS] Display 속성 - block, inline, inline-block 으로 요소 정렬하기, Float 속성으로 페이지 구조화하기

block, inline, inline-block의 개념을 명확히 짚고 넘어가고자 정리해보았습니다.

2020년 11월 17일
·
0개의 댓글
post-thumbnail

CSS - Position

✅ position 속성 - relative, absolute, fixed✅ inline, inline-block, block 에 대해서✅ float에 대해서◾ static일 때 해당 요소의 현재 기본 위치 기준 ◾ 정확한 위치는 top right bottom lef

2020년 11월 17일
·
0개의 댓글
post-thumbnail

TIL | CSS - Layout _position .2

position 두 번째 시간이다. display display는 CSS에서 layout을 제어하기위한 가장 중요한 프로퍼티이다. 모든 element는 그 유형에 따른 기본 표시값이 있고, 대부분의 기본 표시값은 두가지로 나뉜다. block 첫 번째로 blo

2020년 10월 21일
·
0개의 댓글

18-2. 레이아웃의 모든 것

html & cssposition 속성 - static, relative, absolute, fixed01/ static(기본위치)기본위치02/ relative(상대위치)기본위치를 기준으로 좌표 프로퍼티(top, bottom, left, right)를 사용하여 위치를

2020년 8월 20일
·
0개의 댓글
post-thumbnail

[CSS] Position

1. Position 속성 - relative, absolute, fixed 1) relative 2) absolute 3) fixed 2. Display property 1) inline inline element의 특징은 가장 대표적인 inline element는

2020년 8월 19일
·
0개의 댓글
post-thumbnail

TIL #19 CSS-inline vs block vs inline-block

inline vs block vs inline-block

2020년 8월 19일
·
0개의 댓글

[CSS] 2_block, inline, inline-block

1. block & inline &nbsp 어떤 요소가 실제 content 의 너비와 상관 없이 페이지 안에서 너비를 다 쓰면 이걸 block 이라고 한다. HTML element 대부분은 block 이다. header, footer, p, li, table, di

2020년 8월 19일
·
0개의 댓글
post-thumbnail

TIL 36 | HTML/CSS, position/display/float

position 속성 1.relative relative는 별도의 property를 지정하지 않으면, static과 동일하게 동작한다. 태그의 위치를 살짝 변경하기 위해서 position: relative; 를 사용하면 좋다. 지정된 element의 위치를 변경하려

2020년 8월 19일
·
0개의 댓글