# border

28개의 포스트
post-thumbnail

Inner Border?

Border는 바깥으로 그려질까 안쪽으로 그려질까? 오해와 삽질에 대해 정리해본다.

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

CSS 속성 (1)

HTML 속성 (Attributes) CSS 속성 (Properties) JS 속성 (Properties) 박스 모델: HTML요소의 기본적인 모양을 만들어내는 여러가지 속성들 (가로너비, 세로너비, 여백 등등) 글꼴, 문자: 폰트(서체) 배경, 배치(특정 요소를

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

테두리(border)

내용(content)와 패딩(padding)을 감싸는 영역선으로 표시하며 선에 여러 종류가 있습니다. border-style: 값;보더속성도 패딩속성과 동일하게 축약해서 태그를 사용할 수 있습니다.border: 3px solid red;보더의 전체 크기는 3px, 선타

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

웹 프로그래밍 3일차(실습)

꿀팁div class빠르게 적는방법①div.div1②.div2"."이 클래스를 의미하기 때문에 .div2라고 적어도 바로 div class가 나온다.참고자료:(무료html 템플릿)https://www.free-css.com/free-css-templates(

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

CSS box model 활용

CSS box model 활용 imageCSS box model 활용 image‏‏‎ ‎CSS box model 활용 image‏‏‎ ‎CSS box model 활용 imageCSS box model 활용 image‏‏‎ ‎CSS box model 활용 im

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

[CSS] Outline 과 Border

border는 다들 익숙할 것이다. outline을 많이 사용해보지 않아서 정리가 필요하다고 생각했다.아래 그림을 보면 쉽게 이해할 수 있다.Outline은 Border 바깥에 적용이 되는 것이며, border값은 값이 커지면 주변 레이아웃에 영향을 주게 된다. 하지만

2022년 4월 18일
·
0개의 댓글
·
post-thumbnail

➖ Border and Outline

input태그를 styling하다 border속성과 outline속성의 차이가 무엇일까 궁금하여 작성한다.border은 요소의 안쪽선을 정의하도록 하는 속성이다.border은 element 안쪽에서 만들어진다.border은 공간을 차지한다.borderborder:non

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

[CSS] border vs outline 차이알고 이슈해결하기

아래는 프로젝트 진행중에 발생했던 이슈.border-bottom을 보였다 안보였다할 때, 뭔가 아주 살짝씩 placeholder에 있는 글이 움직이는 걸 볼 수 있다.현재 구현방법은 focus가 되었을 때, 테두리의 굵기, 스타일, 컬러를 한번에 지정하는 방식이다.bo

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

[CSS] 테두리 영역

마진과 패딩을 시작으로, 콘텐츠를 다루었습니다. 이번에 요소를 차지하는 또 다른 구성요소인 테두리에 대한 속성을 알아보겠습니다.border-width속성은 테두리의 굵기를 지정합니다. 굵기 지정 방식은 px 등의 단위를 이용한, 직접 지정 방식과, thin, mediu

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

캐릭터 만들기

캐릭터 body { background-color: rgb(255, 255, 147); } .hood { width: 600px; height: 66

2021년 11월 21일
·
0개의 댓글
·
post-thumbnail

211001_CSS(4) _box-model

content: 콘텐츠가 표시되는 영역 width, height(진짜 내용을 담고 있는 핵심 박스)padding: 콘텐츠와 테두리(border)사이의 여백 (공백 영역)border : padding 과 margin 사이의 테두디 기본값음 0px 이지만 보더 영역이 있다

2021년 10월 1일
·
0개의 댓글
·
post-thumbnail

[CSS] Box Model

Box Model의 margin, border, padding 영역과 관련된 내용을 다룬다.

2021년 9월 29일
·
0개의 댓글
·
post-thumbnail

[HTML&CSS] border와 background

<;오케이 걸려들었고...>코딩은 그저 해킹하는 기술인 줄 알았다. 근데 CSS를 배우면서 그림을 그리고 있는 나를 발견했다. 참 신기했다. border 는 테두리의 두께, 색 등을 설정하는 속성이다. 아니 코딩하는데 테두리가 왜 나와?

2021년 9월 16일
·
0개의 댓글
·

0706 - HTML/CSS

h3+p+ul>(li\*3)h3+(ul>(li\*2))+divid=button속성값의 개수에 따라 적용되는 위치모든 HTML태그 요소를 선택전체선택자에 의해 선택된 모든 요소에서 패딩과 마진을 0 으로 초기화background-image 속성배경 이미지 삽입에 사용ur

2021년 7월 6일
·
0개의 댓글
·
post-thumbnail

[CSS] Margine, Border, Padding

위, 아래 경계가 같다면 더 큰값의 margine 적용.(Collapsing margine)margin : a, b, c, d;(상, 하, 좌, 우) 값을 줄 수 있음.box 경계로 부터 바깥에 있는 공간 (border &lt; margine)box 경계 안쪽의 공간

2021년 6월 22일
·
0개의 댓글
·
post-thumbnail

TIL 07. Box Model & Type

✏️ Box Model 과 Box Type을 살펴보자

2021년 6월 7일
·
0개의 댓글
·

CSS의 테두리 선

요소의 테두리 선을 지정하는 단축 속성

2021년 5월 21일
·
0개의 댓글
·
post-thumbnail

[인스타클론] 반투명한 안쪽 테두리가 있는 이미지

이를 위해 세가지 조건이 필요하다.1\. 투명할 것2\. 이미지 위에 있는 요소여야 할 것3\. 균일한 두께의 테두리 여야 할 것처음에는 그냥 border를 적용했지만, border는 이미지 위에 적용되지 않고 바깥에 적용되어서 border가 일러스트레이터처럼 정교하게

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