728x90 전체 글111 5. 텍스트 스타일링 텍스트 정렬 (text-align)간격텍스트 장식 (text-decoration)그림자 효과 (text-shadow)대소문자 변환 (text-transform) 텍스트 정렬 (text-align)start: 현재 텍스트 줄의 시작 위치에 정렬end: 현재 텍스트 줄의 끝 위치에 정렬left: 왼쪽 정렬right: 오른쪽 정렬center: 가운데 정렬justify: 양쪽에 맞추어 정렬match-parent: 부모 요소를 따라 정렬- 활용 코드 .text-center { text-align: center; } .text-right { text-align: right; } 간격글자 간격 (letter-spacing)단어 간격 (word-spacin.. 2024. 7. 4. 4. 색상 활용 색상 이름16진수RGB(RGBA)HSL(HSLA) 색상 이름색상의 이름을 직접 사용해서 지정할 수 있으나, 모든 색상의 이름을 알고 있기 어려워 사용에 제약이 있다. 전체 색상 이름은 아래 사이트에서 참조 가능하다. - CSS: Cascading Style Sheets | MDN (mozilla.org) - 활용 코드 파란색 배경색 적용 오랜지색 글씨 적용 - 실행 결과파란색 배경색 적용 오랜지색 글씨 적용" data-ke-type="html">HTML 삽입미리보기할 수 없는 소스 16진수#로 시작하고, 2자리씩 3개의 16진수로 색상 표현 ex) #00ff99#RRGGBB: RR(빨간색), GG(초록색), BB(파란색)각 2자리의 16진수는 00~FF까지 표현 가능#000000(검은.. 2024. 7. 4. 3. 글꼴 스타일링 글꼴 (font-family)일반적으로 글꼴을 지정할 때 한 가지 글꼴을 선택한다.이때 문서에 저장된 글꼴 중 없을 경우를 대비해 글꼴 이름을 2개 이상 지정하기도 한다.첫 번째 글꼴이 없으면, 그 다음 글꼴을 적용한다.font-family: | , - 활용 코드 .font1 { font-family: 'Courier New', Courier, monospace; } .font2 { font-family: Arial, Helvetica, sans-serif; } 글자 크기 (font-size)절대 크기: 브라우저에서 지정한 글자 크기상대 크기: 부모 요소의 글자 크기를 기준으로 상대적인 글자 크기 지정크기: 브라우저와 상관없이 글자 크기 .. 2024. 7. 4. 2. CSS 기본 선택자 전체 선택자태그 선택자id 선택자클래스 선택자그룹 선택자 전체 선택자스타일을 문서의 모든 요소에 적용* {속성: 값; ...} 태그 선택자특정 태그를 사용한 모든 요소에 스타일 적용태그명 {스타일 규칙} id 선택자고유한 식별자인 id 를 사용하여 요소 선택.id 선택자는 문서에서 한 번만 적용할 수 있으며, 다른 선택자보다 우선순위가 높다.#아이디명 {스타일 규칙} 클래스 선택자HTML 요소에 임의의 클래스를 지정하여 해당 클래스를 가진 모든 요소를 선택..클래스명 {스타일 규칙} 그룹 선택자여러 선택자에서 같은 스타일 규칙을 사용하여 적용선택자1, 선택자2 {스타일 규칙} 스타일 우선순위일반적으로 나중에 작성한 스타일이 먼저 작성한 스타일을 덮어쓴다.!important > 인라인 스타일 > .. 2024. 7. 4. 이전 1 ··· 12 13 14 15 16 17 18 ··· 28 다음 728x90