W3.CSS 다운로드
W3.CSS 다운로드
이 링크에서 W3.CSS를 다운로드: https://www.w3schools.com/w3css/4/w3.css
W3.CSS는 무료입니다
W3.CSS는 무료입니다. 라이센스가 필요하지 않습니다.
W3.CSS 사용법
W3.CSS를 사용하려면 웹 페이지에 "w3.css"에 대한 링크를 추가하기만 하면 됩니다.
예시
<!DOCTYPE html>
<html>
<title>My Web</title>
<meta
name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet"
href="https://www.w3schools.com/w3css/4/w3.css">
또는 w3.css를 다운로드하고 자신의 웹 사이트에서 실행하십시오.
예시
<!DOCTYPE html>
<html>
<title>My Web</title>
<meta
name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet"
href="w3.css">
w3.css를 하위 폴더에 넣는 경우 슬래시 사이에 폴더 이름을 추가합니다.
예시
<!DOCTYPE html>
<html>
<title>My Web</title>
<meta
name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet"
href="/foldername/w3.css">
웹 루트에 w3.css를 배치하는 경우 슬래시를 추가합니다.
예시
<!DOCTYPE html>
<html>
<title>My Web</title>
<meta
name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet"
href="/w3.css">
변경 로그
이 링크에서 버전 4.13을 다운로드하십시오: https://www.w3schools.com/w3css/4/w3.css
| 보다 | 날짜 | 설명 |
|---|---|---|
| 4.15 | 2020년 12월 | w3-sans-serif w3-cursive w3-monospace 로 보완된 w3-serif |
| 4.14 | 2020년 11월 | w3-padding-top-64 w3-padding-top-48 w3-padding-top-32 w3-padding-top-24로 보완된 w3-padding |
| 4.13 | 2019년 6월 | Normalize.css의 사소한 변경 사항에 적용됨 |
| 4.12 | 2018년 11월 | w3-stretch 추가됨 |
| 4.11 | 2018년 10월 | w3-auto 추가됨 w3 -content에서 margin:auto를 margin-left:auto 및 margin-right:auto로 변경 |
| 4.10 | 2018년 2월 | w3-bar 및 w3-bar-block의 w3-bar-item에 "outline:0" 추가 |
| 4.09 | 2017년 12월 | 버튼에서 "outline:0" 제거 |
| 4.08 | 2017년 10월 | w3-dropdown-content에 "z-index:1"을 추가했습니다. |
| 4.07 | 2017년 8월 | 이미지에 "vertical-align:middle" 추가 |
| 4.06 | 2017년 8월 | 테두리, hoverable 테두리 및 hoverable 텍스트에 버전 3 색상 클래스 추가 |
| 4.05 | 2017년 6월 | w3-responsive에 "display:block"을 추가했습니다. |
| 4.04 | 2017년 4월 | w3-bar-block 내부의 w3-bar-item에 "float:none" 추가 |
| 4.03 | 2017년 3월 | "w3-col m3"의 사소한 버그 수정 |
| 4.02 | 2017년 3월 | 버전 3 텍스트 색상 추가 |
| 4.01 | 2017년 3월 |
밝은 회색/회색 일부 테두리 색상 오류 수정 |
| 4.0 | 2017년 2월 | |
| 3.0 | 2017년 1월 1일 | |
| 2.0 | 2016년 2월 | |
| 1.0 | 2015년 5월 |
GitHub 리포지토리
GitHub 저장소: https://github.com/JaniRefsnes/w3css
W3.CSS 유효성 검사
W3.CSS의 유효성을 검사하면 일부 오류가 반환될 수 있습니다.
W3C 유효성 검사를 실행할 때 종종 몇 가지 오류가 발생합니다.
현재 W3C 사양을 벗어나는 일부 브라우저 특정 값은 항상 있습니다.
| 재산 | 설명 |
|---|---|
| 포인터 이벤트 | CSS3의 속성이 잘못되었지만 CSS4에 제안되었습니다. 비활성화된 요소에서 손 포인터를 제거하기 위해 W3.CSS에서 사용됩니다. |
| 사용자 선택 | CSS3의 속성이 잘못되었지만 CSS4에 제안되었습니다. W3.CSS에서 클릭 가능한 요소에서 텍스트 선택을 제거하는 데 사용됩니다. |
| 의사 클래스 : 유효 | CSS3의 값이 잘못되었지만 CSS4에 대해 제안되었습니다. 유효한 입력을 나타내기 위해 W3.CSS에서 사용됩니다. |
| @-webkit-keyframes | 웹킷 브라우저(이전 버전의 Chrome, Safari 및 Opera)에서 애니메이션이 작동하도록 W3.CSS에 추가되었습니다. |
W3.CSS 사용자 지정
W3.CSS에는 기본 글꼴과 글꼴 크기가 포함되어 있습니다.
다음 설정을 변경하여 W3.CSS를 사용자 정의할 수 있습니다.
예시
html {
font-family: Verdana, sans-serif;
font-size: 15px;
line-height: 1.5;
font-weight: normal;
}
h1, h2, h3, h4, h5, h6 {
font-family: "Segoe UI", Verdana, sans-serif;
font-weight: 400;
line-height: 1;
margin:
20px 0;
}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {font-weight: inherit;}
h1
{font-size: 36px}
h2 {font-size: 30px}
h3 {font-size: 24px}
h4
{font-size: 20px}
h5 {font-size: 18px}
h6 {font-size: 16px}
hr
{
height: 0;
border: 0;
border-top: 1px solid
#eee;
margin: 20px 0;
}
W3.CSS가 정규화됨
스타일 시트 정규화는 다음과 같이 수행됩니다.
- 브라우저 버그 수정
- 브라우저 불일치 제거
- 일반적인 브라우저 기본값 보장
- 모든 HTML 요소의 스타일 표준화
- CSS 개선 사항 추가
Normalize.css 의 추출 은 W3.CSS에서 사용됩니다.
따라서 W3.CSS는 모든 브라우저에서 일관되게 HTML을 표시하고 최신 웹 표준에 부합합니다.