본문 바로가기

분류 전체보기589

CSS Table CSS border 속성 CSS에서 테이블 테두리를 지정한다. border 속성을 사용한다. 아래 예제에서는 , 및 요소에 대한 솔리드 테두리를 지정한다: 테이블에 테두리를 추가: 이름 성 길동 홍 철수 이 table, th, td 요소에 border 속성을 1px solid 값을 설정하였고, 결과 화면은 아래 그림과 같다. CSS width: 100% 속성 위의 테이블은 경우에 따라 작아 보일 수 있다. 전체 화면에 걸쳐 있어야 하는 테이블(전체 너비)이 필요한 경우 요소에 width: 100%를 추가한다: 테이블에 테두리를 추가: 이름 성 길동 홍 철수 이 table, th, td 요소에 border 속성을 1px solid 값을 설정하였고, table 요소에 width속성에 100%값을 설정한 결과.. 2023. 8. 14.
CSS lists HTML list와 CSS list HTML에서는 두 가지 주요 목록 유형이 있다: 정렬되지 않은 목록() - 목록 항목에 글머리 기호가 표시된다 순서 목록() - 목록 항목이 숫자 또는 문자로 표시된다 CSS list 속성을 통해 다음 작업을 수행할 수 있다: 정렬된 목록에 대해 다른 목록 항목 마커 설정 항목 마커 설정 순서가 지정되지 않은 목록에 대해 서로 다른 목록 항목 마커 설정 이미지를 목록 항목 마커로 설정 목록 및 목록 항목에 배경색 추가 CSS list-style-type : marekr list-style-type 속성은 목록 항목 marker의 유형을 지정한다. 다음 예제에서는 사용 가능한 목록 항목 마커 중 일부를 보여 준다: list-style-type 속성 비순서 리스트 예제: .. 2023. 8. 13.
CSS link CSS links CSS를 사용하면 링크를 다양한 방식으로 스타일링할 수 있다. CSS sytling link link 는 모든 CSS 속성(예: 색상, 글꼴 패밀리, 배경 등)으로 스타일을 지정할 수 있다. 색상 스타일을 설정한 링크 이것은 링크입니다. a 요소에 색상을 hotpink로 설정하였고, 아래 링크에 색상이 hotpink로 설정한 결과 화면은 아래 그림과 같다. 또한 링크는 어떤 상태에 있는지에 따라 다르게 스타일을 지정할 수 있다. 네 가지 링크 상태는 다음과 같다: a:link - 방문하지 않은 일반 링크 a:visited - 사용자가 방문한 링크 a:hover - 사용자가 마우스를 위로 이동할 때 링크 a:active - 클릭하는 순간의 링크 상태에 따른 스타일링 링크 이것은 링크이다... 2023. 8. 12.
CSS font 속성 CSS font 속성 코드를 단축하기 위해 하나의 속성에 모든 개별 글꼴 속성을 지정할 수도 있다. font 속성은 다음의 약자 속성이다: font-style font-variant font-weight font-size/line-height font-family 참고: font-size 및 font-family 값은 필수이다. 다른 값 중 하나가 누락된 경우 기본값이 사용된다. font 를 사용하여 하나의 선언에 여러 글꼴 속성을 설정한다: font 속성 이것은 단락입니다. 글꼴 크기는 20픽셀로 설정되며 글꼴 패밀리는 Arial입니다. 이것은 단락입니다. 글꼴은 기울임꼴, 작은 대문자 및 굵은 글씨로 설정되고, 글꼴 크기는 12픽셀, 선 높이는 30픽셀, 글꼴 패밀리는 Georgia. p.a 요소에 .. 2023. 8. 11.