CSS 공유를 위한 8가지 팁

CSS에는 다양한 기능이 있습니다. 여기서 편집자는 CSS에 관한 8가지 팁을 알려드립니다.

1. 반투명 효과를 표시하기 위해 모든 브라우저와 호환

<div class="transparent"></div>
.transparent {
    filter: progid:DXImageTrans
for
m.Microsoft.Alpha(opacity=50);
    -moz-opacity: 0.5;
    -khtml-opacity: 0.5;
    opacity: .5;
    
width
: 200px;
    
height
: 200px;
    
margin
: 0 auto;
    
background
: url("../img/pic.jpg");
}

2. _height, _width의 역할

float<🎜 문제를 해결하려면 _height를 사용하세요. > div가 닫히지 않는 문제의 경우 _height 속성을 제거하여 효과를 얻을 수 있습니다.

<div id="wrap">
    <div class="column_
left
">
        <h1>Float left</h1>
    </div>
    <div class="column_
right
">
        <h1>Float right</h1>
    </div>
</div>
#wrap {
    b
ord
er: 6px solid #ccc;
    
overflow
: auto;
    _height: 1%;
}
.column_left {
    width: 20%;
    
padding
: 10px;
    float: left;
}
.column_right {
    float: right;
    width: 75%;
    padding: 10px;
    border-left: 6px solid #ccc;
}

3. min-height min-width를 사용하여 div 또는 범위의 고정 높이 문제를 해결합니다.

때때로 요소의 고정 높이를 설정해야 하지만 Firefox 또는 Opera에서는 콘텐츠가 충분하지 않으면 기대한 효과를 얻을 수 없습니다. 이때 min-height를 사용할 수 있습니다

4. 미디어 지시어를 사용하여 인쇄라는 두 가지 유형의 CSS를 소개합니다. CSS 버전 및 화면 표시 CSS.

<link type="text/css" rel="stylesheet" href="url" media="screen" charset="utf-8">
<link type="text/css" rel="stylesheet" href="url" media="print" charset="utf-8">

5. .fixTable{ table-layout:fixed;overflow:hidden;을 사용하고 nobr 태그를 추가하여

6. page-break-after, page-break- before를 사용하여 인쇄 중 페이징을 제어합니다.

7. *html{}의 기능은 6.0 미만의 IE 버전과 호환되며 html 노드를 선택하려면 다른 브라우저를 사용하세요. html 태그를 문서의 루트 노드로 간주하고, ie6 이하의 IE 버전에서는 html 태그 위에 루트 노드

가 있다고 생각합니다. 8. text-indent를 사용하여 그림을 표시하고 텍스트를 숨깁니다<🎜. >

h1 {    background: url(../img/pic.jpg) no-repeat;    width: 200px;    height: 200px;    text-indent: -2000px}

[관련 추천]

1.

특별 추천: "php Programmer Toolbox" V0.1 버전 다운로드2.

무료 CSS 온라인 동영상 튜토리얼

3.

php.cn Dugu Jiujian (2) - CSS 동영상 튜토리얼

위 내용은 CSS 공유를 위한 8가지 팁의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!