1. 아웃라인(outline)
- outline 속성과 border 속성은 비슷하다. border가 테두리면 outline은 바깥 외곽선이라고 말한다.
- 요소를 두드러져 보이게 만들고자 할 때 사용한다.
- outline-style
- outline-width
- outline-color
- outline-offset
1-1 outline 여러 가지 속성
<style>
div {width: 150px; height: 80px;}
div.a
{
border: solid 3px skyblue;
outline-style: solid;
outline-width: 5px;
outline-color: gray;
outline-offset: 5px;
}
</style>
<body>
<div class="a"></div>
</body>
- outline-style은 [CSS] 테두리(border) 참고
- style, width, color 적용방법은 border와 동일하므로 설명은 필요 없을 거 같다.
- outline의 축약 방법 또한 border와 동일하다.
- outline-offset : border로부터 속성값만큼 간격을 띄운다.
'FrontEnd > Css' 카테고리의 다른 글
[CSS] position, z-index (0) | 2021.07.29 |
---|---|
[CSS] display, visibility, opacity (0) | 2021.07.27 |
[CSS] 마진(margin) (0) | 2021.07.27 |
[CSS] 테두리(border) (0) | 2021.07.27 |
[CSS] 패딩(padding) (0) | 2021.07.27 |