어떻게 바닥글을 취소하고 적절한 배치를위한 수레

어떻게 바닥글을 취소하고 적절한 배치를위한 수레

대부분의 초보자는 CSS를 사용자가 심지어 "지우기"재산의 들어본 적이있다. 내가 과거에, 내가하지 않았다면 몇 시간 동안 내 레이아웃을 올바르게 표시 떠있는 사이드바를 함께 알아 내려고 내 두뇌가 깨졌어. 여기가 어떻게 작동 :

렌더링 div를 할 때, 브라우저의 정상적인 흐름, 그리고 그 후에도 사물의 정상적인 흐름에서, 다음 한 곳에 하나의 곳으로이다. div를 할 때 옆에 사이드를 갖고 싶어요, 평소 솔루션은 "재산을 그들에게"플로트 추가하는 것입니다. 아래의 경우에는 둘 다 "왼쪽 - 비행"분주하고 "콘텐츠"div의 속성 "플로트 : 왼쪽;". 당시, 우리가 떠오르 div를 안으로, 콘텐츠를 넣을 수와 행복의 레이아웃을 가지고있다. 문제는, 그 사물의 정상적인 흐름에서 레이아웃을 계속하는 것도, 그래서 우리가 일을 추진하기 위해 브라우저를 알려줄 필요가있다. 이 두 예제를 참고 사항 :

부정확 :

  id="wrapper">를 <div 
     id="left-nav">를 <div 
         ... 
     </ div는> 
     id="content">를 <div 
         ... 
     </ div는> 
  </ div는> 
  를 <div = 신분증이 텍스트의 떠오르 <p> "footer"> div를 밑에 숨겨진입니다! </ div는>

정답 :

  id="wrapper">를 <div 
     id="left-nav">를 <div 
         ... 
     </ div는> 
     id="content">를 <div 
         ... 
     </ div는>

  를 <div style="clear: both;"> <! - 취소 수레 --></ div는> 

  </ div는> 
  지금 내 바닥글 "footer"> <p>를 <div = 아이디 떠다니는 요소 아래에 표시합니다!! </ div는>

그 작은 라인 "을 계속해 가고있다"로, 브라우저에게 내려 흐름을 이동합니다. 이 테스트를 위해 가장 쉬운 방법은 ""배경 색상 래퍼주고이며, 두 개의 코드 조각의 차이에있을 때 각 요소의 콘텐츠입니다.

하이테크 인터랙티브 웹 2.0 예제 :

예제 1 (잘못된) :

  +--(# 래퍼 )---------------------------------+ 
  | +-----------+ +--------------------+ | 
  +---| |----| |---+ 
      | | | | 
      | | | | 
      | | | | 
      | | | | 
      | # 왼쪽 - 비행 | | # 콘텐츠 | 
      | | | | 
      | | | | 
      | | | | 
      | | | | 
      | | | | 
      | | | | 
      +-----------+ +--------------------+

예제 2 (정답) :

  +--(# 래퍼 )---------------------------------+ 
  | +-----------+ +--------------------+ | 
  | | | | | | 
  | | | | | | 
  | | | | | | 
  | | | | | | 
  | | | | | | 
  | | # 왼쪽 - 비행 | | # 콘텐츠 | | 
  | | | | | | 
  | | | | | | 
  | | | | | | 
  | | | | | | 
  | | | | | | 
  | | | | | | 
  | +-----------+ +--------------------+ | 
  | | 
  | + --- 취소 : 모두 ------------------ + | 
  | | 
 +---------------------------------------------+