# inline

142개의 포스트

block / inline / inline-block

| 특징 | block | inline | inline-block | | --- | --- | --- | --- | | 상하 여백 | O | X | O | | 좌우 여백 | O | O | O | | 요소 사이 줄바꿈 | O | X | X | | 기본 너비가 부모 너비 | O | X | X | | 요소 사이 공백 | X | O | O | | 너비와 높이 명시...

어제
·
0개의 댓글
post-thumbnail

Box Model

태그를 사용해 요소를 삽입했을 때 혼자 한 줄을 차지(요소의 너비가 100%)하는 요소. (왼쪽이나 오른쪽에 다른 요소가 올 수 없음)width, margin, padding 등을 이용해 크기나 위치나 <p>태그 등이 블록 레벨 요소를 만드는 대표적인 태그줄을 차

5일 전
·
0개의 댓글
post-thumbnail

Kotlin Inline Function

인라인(Inline) 키워드는 자바에서는 제공하지 않는 코틀린만의 키워드입니다. 이러한 인라인 키워드를 사용하면 얻을 수 있는 장점들에 대해서 설명해보겠습니다.인라인 함수를 사용한다면 람다식을 사용했을 때 무의미한 객체 생성을 막을 수 있습니다. 글로 설명하는 것보다는

2022년 6월 27일
·
0개의 댓글
post-thumbnail

HTML display의 block과 inline

display의 block과 inline

2022년 6월 22일
·
0개의 댓글

Position, Inline, Block 의 속성

Q1. Position의 속성 중 relative, absolute, fixed는 무엇일까? Q2. Inline, inline-block, block는 뭘까? Display(화면을 배치하는 방법)의 종류이다. Block요소 항상 새로운 라인에서 시작한다. 그리고 브

2022년 6월 21일
·
0개의 댓글

[css]img삽입 시 하단 여백 제거

img태그를 통해 이미지를 삽입하다보면 하단에 애매하게 2~4px정도 여백이 생긴다.우선 해결방법은1) display 변경2) vertical-align 변경둘 중에 하나를 img태그에 적용해주면 해결된다.발생원인은img태그는 기본적으로 inline요소인데, inlin

2022년 6월 15일
·
0개의 댓글
post-thumbnail

[Kotlin] inline class

이번 토픽은 inline class입니다. inline fun은 사용해 봤지만 inline class는 사용해 본적이 없는 것 같아서 주제로 선정하게 되었습니다. 클래스 내부 구조를 살펴볼 때 몇번 본 것 같은데, 왜 사용하는지 알아보겠습니다.다른 변수와 혼동되지 않기

2022년 6월 13일
·
8개의 댓글

2022. 06. 04 국비지원

google에 reset.css cdn 검색코드로 html을 따서 link css 것 위에 넣기.codepen같은 경우는 css 설정에서 css base Reset 설정.그럼 기본적으로 페딩 등 들어있는 것들이 전부 초기화가 된다.대표적으로는 span tag.글자를 만

2022년 6월 3일
·
0개의 댓글
post-thumbnail

[FE Study] block & inline & inline-block

CSS의 box model은 각각 block / inlineinner display type / outer display type으로 나뉨모양새를 쉽게 제어할 수 있어 화면 구성/레이아웃에 사용상자가 한 줄 차지상자는 컨테이너에서 사용 가능한 공간을 채우기 위해 인라인

2022년 6월 2일
·
0개의 댓글
post-thumbnail

화면 표시(display, block, inline, inline-block), 위치지정(position)

display none: 보이지 않게 visibility: 보이게(생략해도됨,default값) block:박스형태의 공간,가로로 꽉채운다. inline:컨텐츠를 작성하는 공간,자기 자신의 크기를 가진다. 크기를 설정 할 수 없음. inline-block: 박스형태의 컨

2022년 5월 30일
·
0개의 댓글
post-thumbnail

CSS 기초 - 생활코딩

기본으로 h1 은 전체 사용 block element, a 태그는 inline element.하지만, display: block; 이나 display:inline;으로 설정변경 가능전체 가로길이를 나눠 간단히 사용. 2fr 1fr; 은 2대 1 비율.\*CSS, HT

2022년 5월 27일
·
0개의 댓글
post-thumbnail

[CSS] display property: inline, inline-block, block

display의 속성 중 inline, inline-block, block 요소 간의 공통점, 차이점을 알아 보자

2022년 5월 25일
·
0개의 댓글
post-thumbnail

[CSS]레이아웃(display/box model/position)

  display 속성은 웹 페이지에서 요소가 어떻게 보여지는지 나타낸다.  블록 요소는 항상 새로운 라인(line)에서 시작하며, 해당 라인의 모든 너비를 차지한다. 기본적으로 블록 속성값을 갖는 <div>, <p>, <h>, <ul>, <

2022년 5월 25일
·
0개의 댓글
post-thumbnail

[HTML/CSS]position, inline, block

📍Position 속성 웹 문서 안 요소들을 어떻게 배치할 지를 정함 position 속성을 이용하면 텍스트나 이미지를 원하는 위치로 배치가능 |속성|내용| |---|---| |relative| 부모 요소에 자연스럽게 연결하여 위치를 지정| |absolute|원하는

2022년 5월 24일
·
0개의 댓글
post-thumbnail

inline, inline-block, block

대표적으로 이라는 태그의 성질로 content/text 크기만큼만 점유하고동일 라인에 붙는 성질width/height 적용 불가margin/padding-top/bottom 적용 불가line-height 원하는 대로 적용 불가(span에 적용안되고 감싸고 있는 div

2022년 5월 24일
·
0개의 댓글
post-thumbnail

inline, inline-block, block

display요소의 화면 출력(보여짐) 특성. 어떻게 보여지는지 인라인 요소가 화면에 보여지는 특성과 블럭 요소가 화면에 보여지는 특성이 다르다. 기본적으로 블럭 요소는 상자, 레이아웃 구성. 인라인 요소는 글자를 제어하기 위한 요소. 따라서 보여지는 특성이 다를 수

2022년 5월 23일
·
0개의 댓글

20220510-TIL

Assignment그 동안 배운 것을 정리할겸 아래의 사이트에서 학습을 완료해주세요.http://learnlayout.com/https://poiemaweb.com/css3-layouthttps://poiemaweb.com/css3-box-m

2022년 5월 11일
·
0개의 댓글

position, inline, block, float

position, inline, block, float

2022년 5월 11일
·
0개의 댓글
post-thumbnail

inline, inline-block, block 에 대해서

![](https://velog.velcdn.

2022년 5월 10일
·
0개의 댓글