29일차 - html5,css3_1

김재령·2022년 2월 26일
0

vscode
ctrl + h 찾아서 바꾸기

라디오나 체크박스에서는 checked를 사용하고 select에서는 selected를 사용한다

정의 및 특징

태그의 selected 속성은 페이지가 로드될 때 옵션 중에서 미리 선택되어지는 옵션을 명시합니다.

selected 속성이 명시된 옵션은 드롭다운 리스트에 가장 먼저 표시되며,

페이지가 로드된 후에도 자바스크립트를 사용하여 selected 속성을 설정할 수 있습니다.

selected 속성은 불리언(boolean) 속성입니다.

불리언 속성은 해당 속성을 명시하지 않으면 속성값이 자동으로 false 값을 가지게 되며,

명시하면 자동으로 true 값을 가지게 됩니다.

아메리카노 카페라테 카페오레 에스프레소


알고 있어야 하는 CSS 속성

[테두리 관련]
border: [두께][유형][색상]
border-radius: px, %
width: px, em, rem, %
height: px, em, rem, %
padding: px, em
padding-top
padding-bottom
padding-left
padding-right

margin: px, em, auto(지정된 div안에서 가운데 정렬해준다/ 바깥쪽 여백을 알아서 맞춰라)
margin-top
margin-bottom
margin-left: auto(오른쪽 정렬)
margin-right: auto(왼쪽 정렬) -> 두개 다 사용하면 가운데 정렬



[배경 관련]
background-color: [색상이름], [RGB 코드], rgba, hsl, rgb(255,255,255);
background-image: url();
background-size: 100%
background-position: center;
background-repeat: no-repeat
overflow: hidden (영역을 벗어나는 컨텐츠를 자동으로 숨겨준다)
sroll, auto



[글자 관련]
color: px, pt, em
font-size: 글꼴, 클라이언트 컴퓨터에서 읽을 수 있는 글꼴
font-family: bolder(굵게)
font-weight: px, pt, em
font-height: px, pt, em
line-height: 한줄이 해당 px을 차지하는 것 / 영역의 높이와 글자 한 줄의 높이를 맞추고 싶을 때



box-sizing: border-box; / 테두리를 포함하여 전체 크기에 맞도록 계산한다 /

fonts -> 실행창에 검색하면 글꼴을 검색할 수 있다

profile
with me

0개의 댓글