CSS79 CSS Counter CSS 카운터는 CSS 규칙에 의해 값이 증가할 수 있는 CSS에 의해 유지되는 "변수"이다(몇 번 사용되었는지 추적하기 위해). 카운터를 사용하여 문서에서 내용의 배치를 기반으로 내용의 모양을 조정할 수 있다. Automatic numbering with counters CSS 카운터는 "변수"와 같다. 변수 값은 CSS 규칙(사용 횟수를 추적하는)에 의해 증가할 수 있다. CSS 카운터를 사용하기 위해 다음 속성을 사용한다: counter-reset - 카운터를 만들거나 재설정합니다 counter-increment - 카운터 값을 증분합니다 content - 생성된 내용 삽입 counter() 또는 counters() 함수 - 요소에 카운터 값을 추가합니다 CSS 카운터를 사용하려면 먼저 counte.. 2023. 9. 10. CSS Website Layout CSS Website Layout 웹 사이트는 종종 머리글, 메뉴, 내용 및 바닥글로 나뉜다: 선택할 수 있는 다양한 레이아웃 설계가 있다. 그러나 위의 구조는 가장 일반적인 구조 중 하나이며, 이 튜토리얼에서 자세히 살펴보겠다. Header 헤더는 일반적으로 웹 사이트의 상단(또는 상단 탐색 메뉴 바로 아래)에 있다. 여기에는 로고 또는 웹 사이트 이름이 포함되는 경우가 많다: Header header 스타일은 background-color #f1f1f1, padding 20px, text-align center 로 스타일을 지정하였고, 위의 코드를 실행한 결과는 아래 그림과 같다. CSS Navigation Bar 탐색 모음에는 웹 사이트를 탐색하는 방문자에게 도움이 되는 링크 목록이 포함되어 있습니.. 2023. 9. 9. CSS textarea, select menu, input button etc CSS Styling Textareas 팁: resize 속성을 사용하여 텍스트 영역의 크기가 조정되지 않도록 한다(오른쪽 하단 모서리의 "그래버" 사용 안 함): Styling textarea Tip: 크기 조정 속성을 사용하여 텍스트 영역의 크기 조정을 방지합니다(오른쪽 하단 모서리에서 "그래버" 사용 안 함): Some text... 위의 코드를 실행한 결과는 아래 그림과 같다. CSS Styling Select Menu Styling a select menu 서울 대구 제주 위의 코드를 실행한 결과는 아래 그림과 같다. CSS input button Styling form buttons 위의 코드를 실행한 결과는 아래 그림과 같다. CSS Responsive Form 브라우저 창 크기를 조정하여 .. 2023. 9. 8. CSS Attribute Selector(속성 선택자) 특정 속성에 HTML 요소들 스타일하기 특정 속성 또는 속성 값을 가진 HTML 요소의 스타일을 지정할 수 있다. CSS [attribute] Selector [속성] 선택자는 지정된 속성을 가진 요소를 선택하는 데 사용된다. 다음 예제에서는 대상 특성을 가진 모든 요소를 선택합니다: CSS [속성] 선택자 대상 속성을 가진 링크가 노란색 배경을 가져옵니다: 네이버l 디즈니 위키피디아 a요소의 target 속성에 배경색을 노랑색으로 지정하는 스타일을 정의하였고, '디즈니'와 '위키피디아'에 적용하여 아래 그림과 같이 표시되었다. CSS [attribute=value] selector [attribute="value"] 선택자는 지정된 속성과 값을 가진 요소를 선택하는 데 사용된다. 다음 예제에서는 tar.. 2023. 9. 6. 이전 1 2 3 4 5 ··· 20 다음
