CSS 글꼴 다시 사용

2935 단어 텍스트CSS
글씨체의 지정에 대해 자신이 모르는 노트.

font-size


·% 를 지정합니다.
상위 요소 글꼴 크기의 백분율을 사용하여 지정합니다.
• 키워드 지정
xx-small、x-small、small、medium、large、x-large、xx-large
・smiler、larger
부모 요소에 비해 한 단계 작거나 크다.

크기 지정 단위


・px
화면 1px를 1로 하는 단위.
・pt
1/72인치(워드프로세서 등에 사용되는 단위)
1인치 = 2.54cm
・em
○ font-size로 지정할 때
부모 요소의 font-size 속성 값이 1인 단위입니다.
예를 들어 부모 요소가 12px일 때 font-size:0.5em 는 6px로 지정하고, font-size:1.5em 는 18px로 지정한다.
○ 기타 요소 지정 시
요소로 지정된 font-size 값은 1 단위입니다.

line-height


행 간격의 높이 지정하기
실수
학점을 추가하지 않고 실수(1.5등)로 지정한다.
글꼴 크기가 지정된 실수에 곱합니다.
단위별 실수
줄 간격은 px 등으로 지정합니다.
퍼센트
글꼴 크기의 백분율을 지정합니다.
・normal
브라우저가 적절한지 판단하는 줄 사이를 설정합니다.(브라우저에 따라 다름)
※ 실수 지정이 있는 이유
line-height도 하위 요소에 영향을 미친다.
line-hegiht의 값이 하위 요소에 영향을 미칠 때 '계산 결과' 의 값은 '지정된 값' 에 영향을 주지 않습니다.
글꼴 크기가 10px인 요소,line-height는 1.5em 또는 150%, 하위 요소의 글꼴 크기가 30px인 요소,line-height는 15px로 문자가 초과됩니다.그래서 라인하이트는 많은 경우에 실수로 지정된다.
<style media="screen">
  #defalut{
    font-size: 10px;
    line-height:1.5em;(←これでは#largeのフォントがはみ出す。"1.5"で指定。)
  }
  #large{
    font-size: 30px;
  }
</style>
<div id="defalut">
  <div>hello</div>
  <div id="large">hello</div>
</div>
・ 부모 요소 값의 속성을 계승하지 않더라도 inherit을 지정하면 계승할 수 있다.

font-family


/font 이름
Arial Bold 같은 글꼴 이름이 아니라 Arial 같은 글꼴 패밀리 이름을 지정합니다.
반각 공백과 기호 등이 있으므로 브라우저에서 글꼴을 인식할 수 있도록 ""을 추가합니다.
묵인
serif、sans-serif、cursive、fantasy、monospace
다섯 가지 키워드로 큰 종류를 지정하다.
표시되는 글꼴은 브라우저에 따라 다릅니다.
여러 개를 지정할 때 ""을(를) 추가하지 않습니다.
(cursive와fantasy가 일본어로 지정되었을 때 크롬이 식별되지 않음)

font-weight


100~900씩 100개씩 지정한다.
숫자가 작을수록 가늘다.

font-style


・italic
사체
・obique
일반 글꼴 비스듬히 보기

font 지정


font : font-sytle font-weight font-size/line-height font-family;
구문을 생성합니다.
※ font-size와 font-family 이외에는 생략할 수 있습니다.
(font-family 부모 요소가 지정하면 생략 가능)
#defalut{
        font: italic 100 1.5em/2 serif;
      }

text-align


블록 수준 요소로만 지정할 수 있습니다.
블록 레벨 요소의 전체 inline 요소의 행 정렬을 지정합니다.

text-decoration


・underline
・overline
・line-through(취소선)
・none

letter-spacing


문자 간격을 지정합니다.줄일 수도 있고.
지정 방법
단위 실수
・normal

text-indet


지정 방법
/단위가 있는 실수 (1em에서 1문자 띄우기 지정)
·%

text-transform


・uppercase
・lowercase (알파벳은 소문자로 표시)
・capitalize

공급업체 접두어


초안 단계의 기능은 처음에 공급업체의 접두사를 붙이는 것이다.
그러나 장래의 그 기능이 확정될 때를 감안하여 공급업체 접두사를 붙이지 않은 기능명을 미리 적는다.

좋은 웹페이지 즐겨찾기