CSS (5) 썸네일형 리스트형 폰트관련 스타일 1.글꼴 (글꼴은 os/웹상에서 사용되는 것.) 선택자{ font-family :"글꼴명1" [,"글꼴명2"]....; } 왼쪽것이 없으면 오른쪽의 글꼴을 가져오게 된다. ㄱ)os에 있는 폰트 사용시 선택자 { font-familly : '글꼴명'; } ㄴ)웹에서 제공해주는 폰트 사용시 웹에서 재공해주는 글꼴을 사용하려면 글꼴의 주소를 style 밖에 줘야된다. 그 후 font-famiily 설정 해줘야 한다. ex) 사용예시(폰트는 구글에 있는 폰트 나눔펜을 사용했다) 2.font-weight(굵기) 선택자 { fontweight : normal /bold /bolder/lighter/100/400/900 ; (보통/굵게/더굵게/원래폰트보다 가늘게/ 값 ) } 3.font-style (기울임) 선택자 .. css 선택자 조건2 1.일반 구조 선택자 부모 안의 형제 관계중 선택자 선택하기 ex)부모선택자 자식선택자:선택 위치{...} ㄱ)선택자 태그= 해당 부모안의 선택위치가 해당 선택자이면 ㄴ)선택자 * = 해당 부모안의 모든 태그중 :first-child 처음 태그 :last-child 마지막 태그 :nth- child(숫자[n]) 위에서 부터 숫자[씩] 태그 :nth-last-child(숫자[n]) 아래서부터 숫자[씩]태그 ex)부모의 id가 #1일때 #1 p:first-child{} -> 부모의 id가 1인 태그 의 첫번째가 p태그일 경우만 변경. (만약 div라거나 다른거면 선택안됨) #1 p:last-child{} -> 부모의 id가 1인 태그 의 첫번째가 p태그일 경우만 변경. (만약 div라거나 다른거면 선택안됨).. css 선택자 조건1 1.선택자를 찾을때 기호에 따른 값 = : 속성의 값이 같을 떄 ~= : 특정 단어를 속성 값으로 가질 때(띄어쓰기된 이름 기준 구분) |= : 속성값이나 속성값- 으로 시작하는 요소를 선택 ^= : 속성 값이 특정 단어로 시작할 때 단어 기준이 아니라 문자열기준 $= : 속성 값이 특정 단어로 끝날 때 단어 기준이 아니라 문자열 기준 *= : 속성 값이 특정 단어를 포함 할때 단어 기준이 아니라 문자열 기준으로 판단. 속성 값이 있으면 다 선택된다. 2. 자손 후손 ㄱ)자손 :부모의 바로 아래의 태그들 부모 >자손 >자손의자손....{ 스타일 지정 } ㄴ)후손 : 자손을 포함해 포함된 태그들 부모 후손{ 스타일지정 } 3.동위선택자 동위선택자는 동급관계에 있는 형제요소에 스타일을 설정할 때 사용한다. .. css의 순위 css는 같은 태그에 속성이 여러번 적용 될 수 있으며, 가장 마지막 설정의 스타일이 실제 태그에 적용 단 CSS 기준의 적용 우선순위가 있을 경우 해당 우선순위에 따라 CSS가 덮어 씌워진다. */ 순위 : 태그 선택자 < 클래스 선택자 < 아이디 선택자 css란 1.css란 html을 꾸미는 것 html이 뼈대라면 css는 피부라고 할 수있다. head부분에 stlyle을 선언후 그안에 사용 css소스가 저장된css파일을 가져와서 쓸때 link태그 link rel = "stylesheet" type = "text/css" : text파일css확장자로 된 것을 쓰겠다. href : 파일 주소 (여러 파일을 불러왔을때 같은 이름이 있으면 마지막 파일의 마지막 코드로 작동) link rel ="stylesheet" type="text/css" href = "../CSS/sample.css" css 선택자 { 스타일 속성들} ex) p { border : 1px solid red; background : black; color : white; } ----> 해당 페이지.. 이전 1 다음
