CSS 최소 너비, 최소 높이 제어

2822 단어 css
http://blog.163.com/chenzhenhua_007/blog/static/12849264920111943230704/
css 속성 사용 가능: min - width.하지만 IE 는 모른다.Google 은 이 문 제 를 css 로 해결 하 는 방법 을 설명 하 는 글 을 찾 았 습 니 다.방법 은 min - width 와 IE 만 인정 하 는 Dynamic Properties 를 함께 사용 하 는 것 이다.
예:
min-width:785px;
width:expression(document.body.clientWidth < 800 ? "785px" : "100%" );

이 물건 정말 좋아, 난 좋아, 하하
고도 최소 값
box {
    min-height:100px;    /*        :100px*/
    height:auto !important; /*  FF,IE7    !important  */
    height:100px; /*  ie6*/
    overflow:visible;
}

이 텍스트 내용 은 ax / min 은 ie7 + firfox, safari, opera 브 라 우 저 에서 모두 지원 되 며, 최대 폭 은 250 px 입 니 다.
그러나 IE6 는 이 속성 을 읽 을 수 없습니다. 다행히 IE 는 자신의 자바 script 속성 표현 을 지원 합 니 다. 예 를 들 어:
div {width: expression r r (250 + "px")} 과 div {widt: 250 px} 은 IE 의 읽 기 에서 일치 합 니 다!그러나 브 라 우 저 에서 자바 script 을 사용 하지 않 는 사용자 가 있다 면 이 작성 은 실 패 했 습 니 다.그래서 다른 방법 이 필요 하 다.
 #mycss {
  width:100%;
  max-width:500px;
  width:e?xpression_r_r_r(document.body.clientWidth > 500? "500px": "auto" ); }

    :
#mycss {
  max-width: 33em;
   width: expression_r_r_r(document.body.clientWidth > (500/12) * parseInt(document.body.currentStyle.fontSize) ? "33em" : "auto" );

  }

우 리 는 용기 my css 의 폭 을 width: 100% 로 설정 했다.사실 이것 은 쓸데없는 말 입 니 다. DIV 는 블록 요소 이기 때문에 기본 폭 은 부모 요소 의 너비 입 니 다.이 예 에서 div 폭 은 성명 을 하지 않 으 면 body 의 너비 와 같 습 니 다.
우 리 는 용기 의 max - width 를 500 px 로 설정 합 니 다.이것 은 FF 에 있어 서 효과 가 있다.IE 에는 소 용이 없다.
효과 없 는 IE 에 e? xpression 적용r_r_r. 스 크 립 트 를 삽입 하여 너비 가 500 px 이상 일 때 너비 가 500 px 와 같다 는 것 을 설명 합 니 다.
   parseInt(document.body.currentStyle.fontSize)?"33e m": "auto" 이 실제 너비 가 (500 / 12) 현재 글꼴 의 크기 보다 크 면 페이지 의 폭 을 33em 으로 설정 합 니 다.
마찬가지 로 가장 작은 너비 와 ax / min - hight 도 마찬가지 입 니 다.
최소:
#mycss {
  min-width: 333px;
  width: expression_r_r_r( document.body.clientWidth < 334 ? "333px" : "auto" );
  }

최대 높이:
#mycss {
   max-height: 333px;
  height: e?xpression_r_r_r( this.scrollHeight > 332 ? "333px" : "auto" )
  }

최소 높이:
4. 567913. 또 하나의 간단 한 방법 이 있다.
 #mycss { min-height: 333px; height: e?xpression_r_r_r( this.scrollHeight < 334 ? "333px" : "auto" );
  }

이 스타일 은 IE 5.5, IE6, IE7, FF, Safari 등 브 라 우 저 에서 최소 높이 문 제 를 해결 할 수 있 으 며, 최대 높이 는 실천 되 지 않 았 습 니 다.

좋은 웹페이지 즐겨찾기