CSS 아웃라인4 CSS outline-offset CSS outline-offset outline-offset 속성은 아웃라인과 요소의 가장자리/테두리 사이에 공간을 추가한다. 요소와 요소 윤곽선 사이의 공간은 투명하다. 다음 예제에서는 테두리 가장자리 바깥쪽의 윤곽선 15px를 지정한다: outline-offset 속성 이 단락의 테두리 바깥쪽 윤곽선은 15px입니다. outline-offset 에 15px를 설정한 결과는 아래 그림과 같다. CSS outline-offset 속성을 간단히 실습하고 개념을 살펴보았다. 꼭 실습하기를 추천합니다. 모두 화이팅입니다.!!! 출처 : 이 글의 출처는 w3schools사이트를 참고하였으며 필자가 추가하여 정리한 글입니다. 2023. 7. 27. CSS outline 단축 속성 CSS outline - 단축 속성 outline 속성은 다음과 같은 개별 outline 속성을 설정하기 위한 단축 속성입니다: outline-width outline-style (required) outline-color outline 속성은 위 목록에서 하나, 둘 또는 세 개의 값으로 지정된다. 값의 순서는 중요하지 않다. 다음 예제에서는 단축 개요 속성으로 지정된 몇 가지 개요를 보여 줍니다: CSS outline - 1개 값 outline 속성 outline 단축속성-1개의값. - 파선 outline 속성에 dashed 값을 설정하여 아웃라인에 파선을 설정한다. 결과 화면은 아래 그림과 같다. CSS outline - 2개 값 outline 속성 outline 단축속성-2개의값. - 점선, 빨강색.. 2023. 7. 26. CSS outline-width CSS outline-width outline-width 속성은 아웃라인의 너비를 지정하며 다음 값 중 하나를 가질 수 있다: thin(일반적으로 1인치) medium(일반적으로 3인치) thick(일반적으로 5인치) 특정 크기(px, pt, cm, em 등) CSS outline-width thin p.ex1 { border: 1px solid black; outline-style: solid; outline-color: red; outline-width: thin; } CSS outline-width를 thin으로 설정한 예제는 아래 표와 같다. outline-width 속성 A thin outline. outline-width를 thin으로 설정한 결과 화면은 아래 그림과 같다. CSS outlin.. 2023. 7. 24. CSS outline 윤곽선은 요소의 테두리 바깥쪽에 그려진 선이다. 아래 그림에서 초록색이 outline으로 테두리 바깥쪽에 그려지는 선이다. CSS outline 속성 outline은 요소를 "눈에 띄도록" 만들기 위해 요소 주위, 테두리 외부에 그려진 선이다. CSS에는 다음과 같은 outline 속성이 있다: outline-style outline-color outline-width outline-offset outline 참고: outline은 테두리와 다르다! 테두리와 달리 outline은 요소의 테두리 밖에 그려지며 다른 내용과 겹칠 수 있다. 또한 outline은 요소 치수의 일부가 아니며, 요소의 전체 너비와 높이는 윤곽선 너비의 영향을 받지 않는다. CSS outline-style 속성 outline-sty.. 2023. 7. 23. 이전 1 다음
