CSS HTML JAVASCRIPT 웹디자인기능사 GSAP 포트폴리오 유튜브 Reference204 border-block-color 속성은 블록(위쪽,아래쪽) 테두리 색 속성을 설정합니다. Reference/CSS border-block-color 속성은 블록(위쪽,아래쪽) 테두리 색 속성을 설정합니다. by @webs 2022. 12. 29. border-block-color border-block-color 속성은 블록(위쪽,아래쪽) 테두리 색 속성을 설정합니다. border는 블록(block)과 인라인(inline)을 구분할 수 있습니다. 블록은 위쪽, 아래쪽으로 말하고, 인라인은 왼쪽, 아래쪽을 의미합니다. 블록은 다시 위쪽(start), 아래쪽(end)으로 분류할 수 있으며, 인라인 역시 왼쪽(start), 오른쪽(end)로 분류 할 수 있습니다. 세부적으로는 두께(width), 스타일(style), 색상(color) 등을 설정할 수 있습니다. 특징 설명 기본값 border-blo.. 2023. 1. 8. border-block 속성은 블록(위쪽,아래쪽) 테두리 속성을 일괄적으로 설정합니다. Reference/CSS border-block 속성은 블록(위쪽,아래쪽) 테두리 속성을 일괄적으로 설정합니다. by @webs 2022. 12. 29. border-block border-block 속성은 블록(위쪽,아래쪽) 테두리 속성을 일괄적으로 설정합니다. border는 블록(block)과 인라인(inline)을 구분할 수 있습니다. 블록은 위쪽, 아래쪽으로 말하고, 인라인은 왼쪽, 아래쪽을 의미합니다. 블록은 다시 위쪽(start), 아래쪽(end)으로 분류할 수 있으며, 인라인 역시 왼쪽(start), 오른쪽(end)로 분류 할 수 있습니다. 세부적으로는 두께(width), 스타일(style), 색상(color) 등을 설정할 수 있습니다. 특징 설명 기본값 border-block-width: .. 2023. 1. 8. background 속성은 배경 이미지의 속성을 일괄적으로 설정합니다. Reference/CSS background 속성은 배경 이미지의 속성을 일괄적으로 설정합니다. by @webs 2023. 01. 03. background background 속성은 배경 이미지의 속성을 일괄적으로 설정합니다. 웹 문서에 이미지를 표현하는 방법은 두가지가 있습니다. img 태그와 background 속성을 이용하는 방법입니다. 원칙적으로 의미가 있는 이미지는 img 태그를 사용하고, 그렇지 않은 경우는 background 속성을 사용합니다. background 속성은 의미가 없는 이미지를 사용하기 위한 방법입니다. 배경이 장식용이거나 디자인 용도라면 background를 이용해서 많이 사용합니다. 여기에는 사이즈, 반복여부, 위치, 효과 등 다양한 속성을 사용할 수 있습니다. 특징 설명.. 2023. 1. 5. background-blend-mode 속성은 배경 이미지를 혼합했을 때의 상태를 설정합니다. Reference/CSS background-blend-mode 속성은 배경 이미지를 혼합했을 때의 상태를 설정합니다. by @webs 2023. 01. 03. background-blend-mode background-blend-mode 속성은 배경 이미지를 혼합했을 때의 상태를 설정합니다. 백그라운드 색상과 백그라운드 이미지를 혼합 했을 때 효과를 만들어 주기 때문에, 두가지 요소가 없다면, 적용이 안 될 수 있습니다. 포토샵의 브랜드 효과와 동일하다고 보시면 됩니다. 웹 문서에 이미지를 표현하는 방법은 두가지가 있습니다. img 태그와 background 속성을 이용하는 방법입니다. 원칙적으로 의미가 있는 이미지는 img 태그를 사용하고, 그렇지 않은 경우는 background 속성을 사용합니다. .. 2023. 1. 4. background-attachment 속성은 배경 이미지의 고정 여부를 설정합니다. Reference/CSS background-attachment 속성은 배경 이미지의 고정 여부를 설정합니다. by @webs 2023. 01. 03. background-attachment background-attachment 속성은 배경 이미지의 고정 여부를 설정합니다. 웹 문서에 이미지를 표현하는 방법은 두가지가 있습니다. img 태그와 background 속성을 이용하는 방법입니다. 원칙적으로 의미가 있는 이미지는 img 태그를 사용하고, 그렇지 않은 경우는 background 속성을 사용합니다. background 속성은 의미가 없는 이미지를 사용하기 위한 방법입니다. 배경이 장식용이거나 디자인 용도라면 background를 이용해서 많이 사용합니다. 여기에는 사이즈, 반복여부, 위치, 효과 .. 2023. 1. 4. background-image 속성은 배경 이미지 경로 및 그라디언트를 설정합니다. Reference/CSS background-image 속성은 배경 이미지 경로 및 그라디언트를 설정합니다. by @webs 2023. 01. 03. background-image background-image 속성은 배경 이미지 경로 및 그라디언트를 설정합니다. 웹 문서에 이미지를 표현하는 방법은 두가지가 있습니다. img 태그와 background 속성을 이용하는 방법입니다. 원칙적으로 의미가 있는 이미지는 img 태그를 사용하고, 그렇지 않은 경우는 background 속성을 사용합니다. background 속성은 의미가 없는 이미지를 사용하기 위한 방법입니다. 배경이 장식용이거나 디자인 용도라면 background를 이용해서 많이 사용합니다. 여기에는 사이즈, 반복여부, 위치, 효과 등 다양한 속.. 2023. 1. 4. background-color 속성은 배경 색을 설정합니다. Reference/CSS background-color 속성은 배경 색을 설정합니다. by @webs 2023. 01. 03. background-color background-color 속성은 배경 색을 설정합니다. 웹 문서에 이미지를 표현하는 방법은 두가지가 있습니다. img 태그와 background 속성을 이용하는 방법입니다. 원칙적으로 의미가 있는 이미지는 img 태그를 사용하고, 그렇지 않은 경우는 background 속성을 사용합니다. background 속성은 의미가 없는 이미지를 사용하기 위한 방법입니다. 배경이 장식용이거나 디자인 용도라면 background를 이용해서 많이 사용합니다. 여기에는 사이즈, 반복여부, 위치, 효과 등 다양한 속성을 사용할 수 있습니다. 특징 설명 기본값 b.. 2023. 1. 4. background-clip 속성은 배경 이미지의 위치 기준점을 설정합니다. Reference/CSS background-clip 속성은 배경 이미지의 위치 기준점을 설정합니다. by @webs 2023. 01. 03. background-clip background-clip 속성은 배경 이미지의 위치 기준점을 설정합니다. 웹 문서에 이미지를 표현하는 방법은 두가지가 있습니다. img 태그와 background 속성을 이용하는 방법입니다. 원칙적으로 의미가 있는 이미지는 img 태그를 사용하고, 그렇지 않은 경우는 background 속성을 사용합니다. background 속성은 의미가 없는 이미지를 사용하기 위한 방법입니다. 배경이 장식용이거나 디자인 용도라면 background를 이용해서 많이 사용합니다. 여기에는 사이즈, 반복여부, 위치, 효과 등 다양한 속성을 사용할 수 .. 2023. 1. 4. background-origin 속성은 배경 이미지의 위치 기준점을 설정합니다. Reference/CSS background-origin 속성은 배경 이미지의 위치 기준점을 설정합니다. by @webs 2023. 01. 03. background-origin background-origin 속성은 배경 이미지의 위치 기준점을 설정합니다. 웹 문서에 이미지를 표현하는 방법은 두가지가 있습니다. img 태그와 background 속성을 이용하는 방법입니다. 원칙적으로 의미가 있는 이미지는 img 태그를 사용하고, 그렇지 않은 경우는 background 속성을 사용합니다. background 속성은 의미가 없는 이미지를 사용하기 위한 방법입니다. 배경이 장식용이거나 디자인 용도라면 background를 이용해서 많이 사용합니다. 여기에는 사이즈, 반복여부, 위치, 효과 등 다양한 속성을 .. 2023. 1. 4. background-position-y 속성은 배경 이미지의 y축 위치를 설정합니다. Reference/CSS background-position-y 속성은 배경 이미지의 y축 위치를 설정합니다. by @webs 2023. 01. 03. background-position-y background-position-y 속성은 배경 이미지의 y축 위치를 설정합니다. 웹 문서에 이미지를 표현하는 방법은 두가지가 있습니다. img 태그와 background 속성을 이용하는 방법입니다. 원칙적으로 의미가 있는 이미지는 img 태그를 사용하고, 그렇지 않은 경우는 background 속성을 사용합니다. background 속성은 의미가 없는 이미지를 사용하기 위한 방법입니다. 배경이 장식용이거나 디자인 용도라면 background를 이용해서 많이 사용합니다. 여기에는 사이즈, 반복여부, 위치, 효과 .. 2023. 1. 4. background-position-x 속성은 배경 이미지의 x축 위치를 설정합니다. Reference/CSS background-position-x 속성은 배경 이미지의 x축 위치를 설정합니다. by @webs 2023. 01. 03. background-position-x background-position-x 속성은 배경 이미지의 x축 위치를 설정합니다. 웹 문서에 이미지를 표현하는 방법은 두가지가 있습니다. img 태그와 background 속성을 이용하는 방법입니다. 원칙적으로 의미가 있는 이미지는 img 태그를 사용하고, 그렇지 않은 경우는 background 속성을 사용합니다. background 속성은 의미가 없는 이미지를 사용하기 위한 방법입니다. 배경이 장식용이거나 디자인 용도라면 background를 이용해서 많이 사용합니다. 여기에는 사이즈, 반복여부, 위치, 효과 .. 2023. 1. 4. background-position 속성은 배경 이미지의 위치를 설정합니다. Reference/CSS background-position 속성은 배경 이미지의 위치를 설정합니다. by @webs 2023. 01. 03. background-position background-position 속성은 배경 이미지의 위치를 설정합니다. 웹 문서에 이미지를 표현하는 방법은 두가지가 있습니다. img 태그와 background 속성을 이용하는 방법입니다. 원칙적으로 의미가 있는 이미지는 img 태그를 사용하고, 그렇지 않은 경우는 background 속성을 사용합니다. background 속성은 의미가 없는 이미지를 사용하기 위한 방법입니다. 배경이 장식용이거나 디자인 용도라면 background를 이용해서 많이 사용합니다. 여기에는 사이즈, 반복여부, 위치, 효과 등 다양한 속성을 사용.. 2023. 1. 4. background-repeat 속성은 배경 이미지 반복 여부를 설정합니다. Reference/CSS background-repeat 속성은 배경 이미지 반복 여부를 설정합니다. by @webs 2023. 01. 03. background-repeat background-repeat 속성은 배경 이미지 반복 여부를 설정합니다. 웹 문서에 이미지를 표현하는 방법은 두가지가 있습니다. img 태그와 background 속성을 이용하는 방법입니다. 원칙적으로 의미가 있는 이미지는 img 태그를 사용하고, 그렇지 않은 경우는 background 속성을 사용합니다. background 속성은 의미가 없는 이미지를 사용하기 위한 방법입니다. 배경이 장식용이거나 디자인 용도라면 background를 이용해서 많이 사용합니다. 여기에는 사이즈, 반복여부, 위치, 효과 등 다양한 속성을 사용할 .. 2023. 1. 4. background-size 속성은 배경 이미지 사이즈를 설정합니다. Reference/CSS background-size 속성은 배경 이미지 사이즈를 설정합니다. by @webs 2023. 01. 03. background-size background-size 속성은 배경 이미지 사이즈를 설정합니다. 웹 문서에 이미지를 표현하는 방법은 두가지가 있습니다. img 태그와 background 속성을 이용하는 방법입니다. 원칙적으로 의미가 있는 이미지는 img 태그를 사용하고, 그렇지 않은 경우는 background 속성을 사용합니다. background 속성은 의미가 없는 이미지를 사용하기 위한 방법입니다. 배경이 장식용이거나 디자인 용도라면 background를 이용해서 많이 사용합니다. 여기에는 사이즈, 반복여부, 위치, 효과 등 다양한 속성을 사용할 수 있습니다. 특징.. 2023. 1. 4. border-radius 속성은 테두리 굴곡을 일괄적으로 설정합니다. Reference/CSS border-radius 속성은 테두리 굴곡을 일괄적으로 설정합니다. by @webs 2022. 12. 29. border-radius border-radius 속성은 테두리 굴곡을 일괄적으로 설정합니다. 특징 설명 기본값 border-top-left-radius: 0 border-top-right-radius: 0 border-bottom-right-radius: 0 border-bottom-left-radius: 0 적용 border 버전 CSS3 사용성 ★★★★★ 정의(Definition) border-radius 속성은 테두리 굴곡을 일괄적으로 설정합니다. border-radius 속성에 "/"가 붙으면 x축 y축을 분리합니다. 비교(Compare) border-radiu.. 2023. 1. 3. border-bottom-right-radius 속성은 아래부분 오른쪽 모서리 굴곡을 설정합니다. Reference/CSS border-bottom-right-radius 속성은 아래부분 오른쪽 모서리 굴곡을 설정합니다. by @webs 2023. 01. 03. border-bottom-right-radius border-bottom-right-radius 속성은 아래부분 오른쪽 모서리 굴곡을 설정합니다. border-radius 속성은 테두리 굴곡을 설정합니다. 일관적으로 설정할 수도 있지만, 개별적으로도 설정이 가능합니다. 속성에 "/"가 있으면 x축, y축으로 나누어서 속성 설정이 가능합니다. 특징 설명 기본값 border-bottom-right-radius : 0 적용 border 버전 CSS3 사용성 ★★☆☆☆ 정의(Definition) border-bottom-right-radius 속성은.. 2023. 1. 3. border-bottom-left-radius 속성은 아래부분 왼쪽 모서리 굴곡을 설정합니다. Reference/CSS border-bottom-left-radius 속성은 아래부분 왼쪽 모서리 굴곡을 설정합니다. by @webs 2023. 01. 03. border-bottom-left-radius border-bottom-left-radius 속성은 아래부분 왼쪽 모서리 굴곡을 설정합니다. border-radius 속성은 테두리 굴곡을 설정합니다. 일관적으로 설정할 수도 있지만, 개별적으로도 설정이 가능합니다. 속성에 "/"가 있으면 x축, y축으로 나누어서 속성 설정이 가능합니다. 특징 설명 기본값 border-bottom-left-radius : 0 적용 border 버전 CSS3 사용성 ★★☆☆☆ 정의(Definition) border-bottom-left-radius 속성은 아래부분 왼.. 2023. 1. 3. border-top-right-radius 속성은 윗부분 오른쪽 모서리 굴곡을 설정합니다. Reference/CSS border-top-right-radius 속성은 윗부분 오른쪽 모서리 굴곡을 설정합니다. by @webs 2023. 01. 03. border-top-right-radius border-top-right-radius 속성은 윗부분 오른쪽 모서리 굴곡을 설정합니다. border-radius 속성은 테두리 굴곡을 설정합니다. 일관적으로 설정할 수도 있지만, 개별적으로도 설정이 가능합니다. 속성에 "/"가 있으면 x축, y축으로 나누어서 속성 설정이 가능합니다. 특징 설명 기본값 border-top-right-radius : 0 적용 border 버전 CSS3 사용성 ★★☆☆☆ 정의(Definition) border-top-right-radius 속성은 윗부분 오른쪽 모서리 굴곡을 .. 2023. 1. 3. border-top-left-radius 속성은 윗부분 왼쪽 모서리 굴곡을 설정합니다. Reference/CSS border-top-left-radius 속성은 윗부분 왼쪽 모서리 굴곡을 설정합니다. by @webs 2023. 01. 03. border-top-left-radius border-top-left-radius 속성은 윗부분 왼쪽 모서리 굴곡을 설정합니다. border-radius 속성은 테두리 굴곡을 설정합니다. 일관적으로 설정할 수도 있지만, 개별적으로도 설정이 가능합니다. 속성에 "/"가 있으면 x축, y축으로 나누어서 속성 설정이 가능합니다. 특징 설명 기본값 border-top-left-radius : 0 적용 border 버전 CSS3 사용성 ★★☆☆☆ 정의(Definition) border-top-left-radius 속성은 윗부분 왼쪽 모서리 굴곡을 설정합니다. 비.. 2023. 1. 3. border-image 속성은 테두리 이미지 속성을 일괄적으로 설정합니다. Reference/CSS border-image 속성은 테두리 이미지 속성을 일괄적으로 설정합니다. by @webs 2022. 12. 29. border-image border-image 속성은 테두리 이미지 속성을 일괄적으로 설정합니다. border-image는 테두리에 이미지를 넣는 기능으로, 이미지를 9등분하여 해당 부분이 네 면에 설정하는 기능입니다. 단순한 이미지도 넣을 수 있지만, 특별한 테두리를 만들고 싶다면 이 속성을 이용하면 편하게 만들 수 있습니다. border-image 속성은 border와 같이 사용됩니다. 특징 설명 기본값 border-image-source : none border-image-slice : 100% border-image-width : 1 border-image-.. 2023. 1. 1. border-image-width 속성은 테두리 이미지 두께 속성을 설정합니다. Reference/CSS border-image-width 속성은 테두리 이미지 두께 속성을 설정합니다. by @webs 2023. 01. 01. border-image-width border-image-width 속성은 테두리 이미지 두께 속성을 설정합니다. border-image는 테두리에 이미지를 넣는 기능으로, 이미지를 9등분하여 해당 부분이 네 면에 설정하는 기능입니다. 단순한 이미지도 넣을 수 있지만, 특별한 테두리를 만들고 싶다면 이 속성을 이용하면 편하게 만들 수 있습니다. border-image 속성은 border와 같이 사용됩니다. 특징 설명 기본값 border-image-width : 1 적용 border 버전 CSS3 사용성 ★☆☆☆☆ 정의(Definition) border-imag.. 2023. 1. 1. border-image-source 속성은 테두리 이미지 경로 속성을 설정합니다. Reference/CSS border-image-source 속성은 테두리 이미지 경로 속성을 설정합니다. by @webs 2022. 12. 29. border-image-source border-image-source 속성은 테두리 이미지 경로 속성을 설정합니다. border-image는 테두리에 이미지를 넣는 기능으로, 이미지를 9등분하여 해당 부분이 네 면에 설정하는 기능입니다. 단순한 이미지도 넣을 수 있지만, 특별한 테두리를 만들고 싶다면 이 속성을 이용하면 편하게 만들 수 있습니다. border-image 속성은 border와 같이 사용됩니다. 특징 설명 기본값 border-image-source : none 적용 border 버전 CSS3 사용성 ★☆☆☆☆ 정의(Definition) bord.. 2023. 1. 1. border-image-slice 속성은 테두리 이미지 영역 속성을 설정합니다. Reference/CSS border-image-slice 속성은 테두리 이미지 영역 속성을 설정합니다. by @webs 2023. 01. 01. border-image-slice border-image-slice 속성은 테두리 이미지 영역 속성을 설정합니다. border-image는 테두리에 이미지를 넣는 기능으로, 이미지를 9등분하여 해당 부분이 네 면에 설정하는 기능입니다. 단순한 이미지도 넣을 수 있지만, 특별한 테두리를 만들고 싶다면 이 속성을 이용하면 편하게 만들 수 있습니다. border-image 속성은 border와 같이 사용됩니다. 특징 설명 기본값 border-image-slice : 100% 적용 border 버전 CSS3 사용성 ★☆☆☆☆ 정의(Definition) border-i.. 2023. 1. 1. border-image-repeat 속성은 테두리 이미지 반복 속성을 설정합니다. Reference/CSS border-image-repeat 속성은 테두리 이미지 반복 속성을 설정합니다. by @webs 2023. 01. 01. border-image-repeat border-image-repeat 속성은 테두리 이미지 반복 속성을 설정합니다. border-image는 테두리에 이미지를 넣는 기능으로, 이미지를 9등분하여 해당 부분이 네 면에 설정하는 기능입니다. 단순한 이미지도 넣을 수 있지만, 특별한 테두리를 만들고 싶다면 이 속성을 이용하면 편하게 만들 수 있습니다. border-image 속성은 border와 같이 사용됩니다. 특징 설명 기본값 border-image-repeat : stretch 적용 border 버전 CSS3 사용성 ★☆☆☆☆ 정의(Definition) b.. 2023. 1. 1. border-image-outset 속성은 테두리 이미지 간격 속성을 설정합니다. Reference/CSS border-image-outset 속성은 테두리 이미지 간격 속성을 설정합니다. by @webs 2023. 01. 01. border-image-outset border-image-outset 속성은 테두리 이미지 간격 속성을 설정합니다. border-image는 테두리에 이미지를 넣는 기능으로, 이미지를 9등분하여 해당 부분이 네 면에 설정하는 기능입니다. 단순한 이미지도 넣을 수 있지만, 특별한 테두리를 만들고 싶다면 이 속성을 이용하면 편하게 만들 수 있습니다. border-image 속성은 border와 같이 사용됩니다. 특징 설명 기본값 border-image-outset : 0 적용 border 버전 CSS3 사용성 ★☆☆☆☆ 정의(Definition) border-.. 2023. 1. 1. border 속성은 테두리 속성을 일괄적으로 설정합니다. Reference/CSS border 속성은 테두리 속성을 일괄적으로 설정합니다. by @webs 2022. 12. 29. border border 속성은 테두리 속성을 일괄적으로 설정합니다. 테두리에는 두께(width), 스타일(style), 컬러(color) 속성을 일괄적으로 설정할 수 있습니다. 테두리는 네 면에 일괄적으로 설정도 가능하지만, 개별적으로 위쪽(border-top), 오른쪽(border-right), 아래쪽(border-bottom), 왼쪽(border-left)으로도 가능합니다. 개별적으로 줄 때도 두께(width), 스타일(style), 컬러(color)를 설정할 수 있습니다. 특징 설명 기본값 border-color : currentcolor border-style : none .. 2022. 12. 30. border-bottom 속성은 테두리 아래쪽 속성을 일괄적으로 설정합니다. Reference/CSS border-bottom 속성은 테두리 아래쪽 속성을 일괄적으로 설정합니다. by @webs 2022. 12. 29. border-bottom border-bottom 속성은 테두리 아래쪽 속성을 일괄적으로 설정합니다. 테두리 아래 속성에 color, style, width 값을 일괄적으로 설정이 가능합니다. 특징 설명 기본값 border-bottom-color : currentcolor border-bottom-style : none border-bottom-width : medium 적용 border 버전 CSS1 사용성 ★★☆☆☆ 정의(Definition) border-bottom 속성은 테두리 아래쪽 속성을 일괄적으로 설정합니다. 비교(Compare) border-bott.. 2022. 12. 30. border-top 속성은 테두리 위쪽 속성을 일괄적으로 설정합니다. Reference/CSS border-top 속성은 테두리 위쪽 속성을 일괄적으로 설정합니다. by @webs 2022. 12. 29. border-top border-top 속성은 테두리 위쪽 속성을 일괄적으로 설정합니다. 테두리 위쪽 속성에 color, style, width 값을 일괄적으로 설정이 가능합니다. 특징 설명 기본값 border-top-color : currentcolor border-top-style : none border-top-width : medium 적용 border 버전 CSS1 사용성 ★★☆☆☆ 정의(Definition) border-top 속성은 테두리 위쪽 속성을 일괄적으로 설정합니다. 비교(Compare) border-top 속성은 테두리 위쪽 속성을 일괄적으로 설정합.. 2022. 12. 30. 이전 1 2 3 4 5 ··· 8 다음