2010-12-09 7 views
-1

플로트는 현재 흐름에서 요소를 왼쪽 또는 오른쪽으로 가져옵니다. 나는 그 요소가 떠 다니는 요소를 따라가는 것을 이해한다. 더 이상 공간이 없을 때까지 다음 요소가 모두 플로트를 감싸고 있습니까? (그래서 만약 내가 p만이 떠있는 그림을 필요로한다면 a와 h3 그리고 다른 p는 더 이상의 공간이 없을 때까지 계속 될 것인가? 아니면 그냥 첫 번째 요소인가?) 나는 또한 명확하게 명확한 요소와 다음 요소를 감싸는 것, 맞습니까? 인라인 또는 블록의 모든 요소가 플로트를 래핑합니까? 그러면 왜 다른 사업부는 안 될까요?CSS에서 플로팅 요소의 기본 정보

나는 div/img p를 떠 다니는 때 왜 그것을 포장할지 아직 이해하지 못한다. 만약 당신이 2 개 div를 가지고 있다면, 첫 번째는 떠 다니고, 왼쪽 뒤에 말하면, div는 새로운 줄에있을 것이다. 아프면 왼쪽으로 떠 다니기도합니다. 전 플로트 옆에 겹쳐 쌓일 것입니다. 그렇지만 처음으로 떠 다니는 경우 첫 줄과 같은 줄에 왜 있어야할까요? 나는 float가 정상적인 흐름을 사용하고 있다고 생각하고, 정상적인 흐름에서 첫번째 float이 div 밑에있을 것입니다. 왜 1 개 부동 소수점 왼쪽 DIV 그 모양을 한 후 다른 플로트 :

------ 
------

아직 병 플로트가 오른쪽 두 번째가 그 것입니다 경우 :

------      ----------

아니라 그 :

------- 
                  -------------

은 흐름에 뭔가를하는 플로트입니까?


얘들 아, 미안하지만, 나 자신을 분명히하지 않았다. 메신저 아무것도하지 않으려 고합니다. 그냥 일반적으로 수레의 동작을 이해합니다.

<div style="float:left"></div> 
<div></div> 

왼쪽에 대해 떠, 아직 어떤 이유로 두 번째 DIV는 (내가 100 % 적은 후 첫 번째 폭을 제공했다 말할 수)합니다 다음 첫 번째에있을 것입니다 :

내가 가지고 말할 수 새로운 라인. 왜 새 줄이 p-wrap과 같지 않고 첫 줄 옆에 있습니까? 우리는 float3d 요소를 감싸지 만 아직 float를 제공하지 않습니다.

초 :

<div style="float:left"></div> 
<div style="float:right"></div> 

모두 div에 (다시 소정의 적절한 폭)는 동일 선상에있을 것이다. 첫 번째 코드가 다른 행에 표시되지만 두 번째 행은 같은 행에 표시되는 이유를 알고 싶습니다. 상자를 현재 흐름에서 측면으로 많이 이동시키지 않아야합니까? 두 번째 div (두 번째 코드)의 현재 흐름이 첫 번째 코드 (한 줄 아래) 에있는 것이므로 두 개의 반대 수레를 사용하면 같은 줄에 div가 표시됩니다. ------ ------ ----------------- 대신에 떠있는 것 중 하나가 바로 지금 어디에 있겠습니까? 첫 번째 div 아래의 한 줄입니까?

답변

0

HTML 태그를 수레 순서로 정렬해야하는 것처럼 들립니다.

오른쪽 부유물이 먼저 와야합니다.

1

나는 3 번이

당신이 하나 개의 요소를 떠하려고 왼쪽과 다른 괜찮아 ... 포기 읽었?

간단하게 그들에게 폭 제공 :

<div style="float: left; width: 400px;">1</div> 
<div style="float: right; width: 400px;">2</div> 

추신을

<div id="container" style="position: absolute; width: 800px; margin: 0 auto; overflow: hidden;"> 
    <div style="float: left; width: 400px;">1</div> 
    <div style="float: right; width: 400px;">2</div> 
</div> 
0

당신의 부모 요소처럼 보이는 당신의 부동 요소 100 % 너비로 설정되지 않은 : 그림은 컨테이너 내부를 원하는 경우 천 단어 ..

[편집]을 말한다. position : relative를 사용하고 너비를 올바르게 설정했는지 확인하십시오.

또한 코드를 보여주십시오. 텍스트를 해독하는 것은 매우 어렵습니다.

0
<div style="float: left;">first line</div> 
<div style="float: right;">second line</div> 
관련 문제