normalize.css

a태그 회색배경 제거

a {background-color:transparent;}

/* 선언순서대로 명시하여 스타일이 엎어치지 않게 처리. */
a:link{}    /* 1st */
a:visited{} /* 2nd */
a:hover{}   /* 3rd */
a:active{}  /* 4th */

text-size-adjust

html { -webkit-text-size-adjust: [none, auto, 100%, inherit]; }

ios의 경우 뷰포트가 변경이 되면 자동으로 폰트 크기가 조절되는데, 이것을 방지하는 속성이 text-size-adjust 이다.

• auto : 화면의 폭에 맞게 텍스트 크기 자동 조절.
• none : 기본값, 자동 조절 방지.
• percentage : 명시적으로 모든 다바이스에서 동일하게 보여지는 방식.
• inherit : 부모의 속성 상속.

button

button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
}

ios와 safari에서 버튼요소의 기본 스타일을 제거.

-moz-focus-inner

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

파이어폭스에서 button 요소에 focus가 주어진 상태에서, 여백을 갖는 것을 해제하는 속성이다.

-moz-focusring

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

파이어폭스의 button 요소에 focus가 주어진 상태에서, 설정되지 않은 점선 스타일을 복원하는 속성.

checkbox & radio

[type="checkbox"],
[type="radio"] {
  box-sizing: border-box;
  padding: 0;
}

IE10에서 여백을 제거하고, box-sizing 속성 추가.

[type=”number”]

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

크롬에서 증감, 감소 버튼을 수정.

[type=”search”]

[type="search"] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

크롬, 사파리에서 이상하게 보여지는 부분을 수정.

::-webkit-search-decoration

[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

macOS 운영체제에서 크롬, 사파리에서의 input [type="search"]의 여백을 제거한다.

input::-ms-clear,
input::-ms-reveal{
	display:none;width:0;height:0;
}
input::-webkit-search-decoration,
input::-webkit-search-cancel-button,
input::-webkit-search-results-button,
input::-webkit-search-results-decoration{
	display:none;
}

input [type="search"]의 X 버튼을 제거하고, 커스텀할 수 있음.

::-webkit-file-upload-button

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

ios와 safari에서 파일 업로드 버튼의 스타일을 지정합니다.