HTML/CSS문법79 CSS 테두리(CSS borders) CSS 테두리 속성을 사용하여 요소 테두리의 스타일, 너비 및 색상을 지정할 수 있다. CSS border-style 속성 border-style 속성은 표시할 테두리의 종류를 지정한다. 다음 값이 허용됩니다: dotted - 점선 경계를 정의합니다 dashed - 파선 경계를 정의합니다 solid - 솔리드 테두리를 정의합니다 double - 이중 테두리를 정의합니다 groove - 3D 그루브 경계를 정의합니다. 효과는 경계-색상 값에 따라 달라집니다 ridge - 3D 능선 경계를 정의합니다. 효과는 경계-색상 값에 따라 달라집니다 inset - 3D inset 테두리를 정의합니다. 효과는 경계-색상 값에 따라 달라집니다 outset - 3D 시작 테두리를 정의합니다. 효과는 경계-색상 값에 따라 .. 2023. 7. 11. CSS background - shorthand 속성 CSS background-shorthand 속성 코드를 단축하기 위해 단일 속성에 모든 배경 속성을 지정할 수도 있다. 이것을 shorthand 속성이라고 한다. 아래와 같이 작성하는 것 대신에: body { background-color: #ffffff; background-image: url("img_tree.png"); background-repeat: no-repeat; background-position: right top; } background 속성을 활용하여 아래와 같이 간략히 작성할 수 있다. body { background: #ffffff url("img_tree.png") no-repeat right top; } shorthand 속성을 사용할 때 속성 값의 순서는 다음과 같다: b.. 2023. 7. 10. CSS background-attacthment CSS background-attacthment 속성 Background-Attachment 속성은 배경 이미지를 스크롤할지 또는 고정할지(페이지의 나머지 부분에서는 스크롤하지 않음)를 지정한다: 배경 첨부 속성 Background-Attachment 속성은 배경 이미지를 스크롤할지 고정할지 여부를 지정합니다(페이지의 나머지 부분에서는 스크롤하지 않음). Tip: 스크롤 막대가 보이지 않으면 브라우저 창의 크기를 조정해 보십시오. 배경 이미지가 고정되어 있습니다. 페이지 아래로 스크롤 시도. 배경 이미지가 고정되어 있습니다. 페이지 아래로 스크롤 시도. 배경 이미지가 고정되어 있습니다. 페이지 아래로 스크롤 시도. 배경 이미지가 고정되어 있습니다. 페이지 아래로 스크롤 시도. 배경 이미지가 고정되어 있습.. 2023. 7. 9. CSS 배경이미지 반복(CSS background image repeat) CSS background-repeat 속성 기본적으로 배경 이미지 속성은 이미지를 수평 및 수직으로 반복한다. 일부 이미지는 수평 또는 수직으로만 반복해야 한다. 그렇지 않으면 다음과 같이 이상하게 보일 수 있다: Hello World! 이상한 배경 이미지... 위의 코드를 실행한 결과 화면이 아래 그림이다. 위의 이미지가 수평으로만 반복되는 경우(background-repeat: repeat-x;) 배경이 더 잘 나타난다: Hello World! 여기서 배경 이미지는 수평으로만 반복됩니다! 위의 코드를 실행한 결과 화면은 아래 그림과 같다. 반복되는 그림이미지가 하나로 단순화한다. CSS background-repeat:no-repeat 배경 이미지를 한 번만 표시하는 것도 background-rep.. 2023. 7. 8. 이전 1 ··· 14 15 16 17 18 19 20 다음
