CSS 테두리5 CSS 둥근 테두리 CSS 둥근 테두리 border-radius 속성은 요소에 반올림된 테두리를 추가하는 데 사용된다: border-radius 속성 이 속성은 요소에 반올림된 테두리를 추가하는 데 사용됩니다: Normal border Round border Rounder border Roundest border 위의 코드를 실행한 결과 화면은 아래 그림과 같다. 지금까지 CSS border-radius 둥근 테두리 스타일 활용에 관하여 간략히 살펴보았다. 꼭 실습하기를 추천합니다. 모두 화이팅입니다.!!!! 출처 : 이 글의 출처는 w3schools사이트를 참고하였으며 필자가 추가하여 정리한 글입니다. 2023. 7. 17. CSS 단축 테두리 속성 CSS border 속성 - 단축 속성 이전 페이지에서 보셨듯이 테두리를 다룰 때 고려해야 할 많은 속성이 있다. 코드를 단축하기 위해 하나의 속성에 모든 개별 테두리 속성을 지정할 수도 있다. 테두리 속성은 다음과 같은 개별 테두리 속성의 단축형 속성이다: border-width border-style(required) border-color 테두리 속성 이 속성은 테두리 너비, 테두리 스타일 및 테두리 색상에 대한 단축 속성입니다. border 단축 속성에 5px, solid, red 를 한번에 스타일을 적용할 수 있다. 테두리 너비, 테두리 스타일, 테두리 색상을 순서대로 설정한다. 아래 그림은 실행 결과 화면이다. 또한 한 면에 대해 모든 개별 테두리 속성을 지정할 수 있다: border-left.. 2023. 7. 16. CSS 테두리 너비(CSS border-width) CSS border-width 속성 border-style 속성은 네 개의 테두리 너비를 지정한다. 너비는 특정 크기(px, pt, cm, em 등)로 설정하거나 미리 정의된 세 가지 값(thin, medium 또는 thick) 중 하나를 사용하여 설정할 수 있습니다: 몇가지 예제를 통해 속성값 등을 이해해보도록 하자. p.one { border-style: solid; border-width: 5px; } border-style은 solid이고 border-width가 5px이다. 이에 대한 결과 화면이다. p.two { border-style: solid; border-width: medium; } border-style은 solid이고 border-width가 medium이다. 이에 대한 결과 화면.. 2023. 7. 14. CSS border-color 속성 CSS border-color 속성 테두리 색 속성은 네 개의 테두리 색을 설정하는 데 사용된다. 색상은 다음과 같이 설정할 수 있다: 이름 - "빨간색"과 같은 색상 이름을 지정합니다 HEX - "#ff0000"과 같은 HEX 값을 지정합니다 RGB - "rgb(255,0,0)"와 같은 RGB 값을 지정합니다 HSL - "hsl(0, 100%, 50%)"과 같은 HSL 값을 지정합니다 투명한 참고: 테두리 색상이 설정되지 않은 경우 요소의 색상을 상속한다. p.one { border-style: solid; border-color: red; } 위의 코드는 border-style은 solid이고 border-color는 빨간색으로 테두리를 설정한다. 아래 그림과 같다. p.two { border-sty.. 2023. 7. 12. 이전 1 2 다음
