일반적으로 사용되는 몇 가지 고전적인 CSS 기술_경험 교환

세로 중심 정렬에 line-height 사용

line-height:24px;
고정 너비 컨테이너를 사용하고 행을 세로 중심에 배치해야 하는 경우 line-height를 사용합니다(높이는 상위 레이어 컨테이너와 동일) 여기에서 더 많은 수직 중앙 정렬 요약을 볼 수 있습니다.

깨끗한 컨테이너 플로트

#main {
overflow:hidden;
}
이러한 문제는 이전에도 언급된 내용입니다.

링크 줄 바꿈 허용 안 함

a {
white-space:nowrap;
}
위 설정을 사용하면 링크 줄 바꿈을 방지할 수 있지만 개인적으로 긴 시간을 권장합니다. 링크에는 해당 줄이 있습니다(줄 바꿈에 대한 설명은 원 중앙의 기록 참조).

Firefox에서 항상 스크롤 막대를 표시하도록 합니다

html {
overflow:-moz-scrollbars-vertical;
}
더 많은 Mozilla/Firefox 비공개 CSS 속성을 참조하세요. 여기까지. 크로스 브라우저 지원을 위해

body, html {
min-height:101%
}
를 사용하여 블록 요소를 가로로 가운데 배치할 수도 있습니다

: 0 auto;
사실

margin-left: auto;
margin-right: auto;
기본적으로 모든 CSS 교과서에 이 기술이 설명되어 있습니다. 너비를 추가하십시오.

body{
text-align: center
}
를 사용한 다음 내부 컨테이너

text-align: left; .

Explorer 텍스트 영역의 스크롤 막대 숨기기

textarea {
overflow:auto;
}
Explor 텍스트 영역에는 기본적으로 세로 스크롤 막대가 있습니다(이유는 묻지 마세요). ) .

인쇄 페이징 설정

h2 {
page-break-before:always;
}
page-break-before 속성은 웹 페이지를 인쇄할 때 페이징을 설정할 수 있습니다.

링크의 점선 상자를 제거하세요

a:active, a:focus {
outline:none
}
Firefox는 기본적으로 링크에 집중합니다( 또는 )을 클릭하고 점선 프레임을 추가합니다. 점선 프레임은 위의 속성을 사용하여 삭제할 수 있습니다.

가장 간단한 CSS 재설정

* {
margin: 0; padding: 0
}
"복잡"해지고 싶다면 YUI의 접근 방식을 참조하세요(또한 여기). 일부 사용자는 원본 메시지에서도 자신의 견해를 표현했습니다.

Niall Doherty의 의견에 동의해야 합니다. * {margin: 0px; padding: 0px;}
기본적으로는 "모든 CSS 요소를 탐색하여 다음
속성". 이는 서버에 매우 불필요한 부담이며
일부 요소를 제거한 후
여백/여백을 다시 제공해야 하기 때문에
나쁜 의미상 관행입니다.