넓고 적응성, 포지셔닝, 숨기기

너비 및 높이 적응
폭 적응
블록 레벨 요소의 너비를 설정하지 않거나 100%로 설정하면 부모 요소의 한 줄을 차지하는 응용 장면이다. 페이지의 가장 바깥쪽에 있는 상자는 일반적으로 화면의 크기를 차지하기 때문에 너비는 100%이다.
높은 적응성
1. 아바타 원소의 높이는 아바타 원소에 의해 벌어진다. (1) 높이는 내려앉는다. 아바타 원소가 모두 부동하면 아바타 원소는 높이가 없다.솔루션(부동 제거):

부모 원소에 마지막 하위 원소(블록급 원소) 하위 원소 css{ height:0;overflow:hidden;clear:both;}를 추가하는 단점: 불필요한 낭비를 초래

부원소에 추가{overflow:hidden;}단점: 필요한 부분을 숨길 수 있음

위원소 제거법(만능 제거법)은 부원소에 위류clearfix::after{}，css를 추가하는 내용은 다음과 같다

/*    （  ）*/
.clearfix:before,.clearfix:after {  /*    */
    content:"";
    display:table;
}
.clearfix:after{clear:both;}
.clearfix{
    *zoom:1;/*IE/7/6*/
}

(2) 하위 원소가 내용이 없는 것을 예방하고 부 원소를 버틸 수 없는 경우 해결 방법: 부 원소에 최소 높이min-height를 추가한다.(내용 높이가 최소 높이보다 작을 때 최소 높이로 표시. 내용 높이가 최소 높이보다 클 때 내용 높이로 표시) 호환 쓰기: {min-height:;（ ） _height:;（IE6）} 2: 창 높이에 맞게 높이body,html{height:100%;}, 가장 바깥쪽에 있는 큰 상자{height:100%;}는 주로 휴대전화 단말기의 탄력성 박스 레이아웃에 사용된다.
포지셔닝 포지션
속성 값
이름:
묘사
static
정적 포지셔닝
기본값
relative
상대 포지셔닝
자신이 있는 위치에 비해 포지셔닝을 하고left,right,topbottom과 협조하여 표준 흐름을 벗어나지 않습니다.
absolute
절대 포지셔닝
html이나 최근에 포지셔닝이 있는 부모 요소에 비해 이동 포지셔닝은left,right,top,bottom에 맞추어 표준 흐름에서 벗어난다.
fixed
고정 위치
브라우저의 시각적 영역에 비해 이동 포지셔닝은left,right,top,bottom과 함께 사용되며 표준 흐름에서 벗어납니다.

/*            */
.father{
	       width: 400px;
           height: 400px;
           background: pink;
           position: relative;/*    */
        }
.father .absolute{
	       width: 200px;
           height: 200px;
           background: #58bc58;
           position: absolute;
           /*      position: relative;
                     */
           /*          */
           bottom: 0;
           right: 0;
         }

감추다
요소 숨기기
display:none 숨김 요소, 위치를 차지하지 않음visibility:hidden 숨김 요소, 위치를 차지
텍스트 숨기기
overflow:hidden 숨김 초과 텍스트 한 줄 초과 표시 생략 번호, 세 줄 조합해서 사용해야 합니다

<style type="text/css">
	p{
	   width: 200px;/*      */
	   white-space: nowrap;/*      */
	   overflow: hidden;
	   text-overflow: ellipsis;/*         */
	}
style>