올바른 방법 인 인라인 블록 또는 플로트는 어느 것입니까?

사이트의 레이아웃을 디자인 중이며 inline-block 또는 float을 언제 사용해야하는지 혼란 스럽습니다. 가장 좋은 방법은 inline-block 또는 float?올바른 방법 인 인라인 블록 또는 플로트는 어느 것입니까?

inline-block을 사용하면 인터넷 탐색기를 지원하지 않습니다. 가끔 float도 손상을 입히고 있습니다 (심지어 clearfix 핵을 사용하는 경우에도).

출처

2013-04-02 Vivek Vikranth

사용 표. – Raptor

클리어 픽스는 모든 경우에 사용할 수 있습니다. 따라서 크로스 브라우저에 대해 염려하는 플로트 속성을 사용하십시오. –

가능한 복제본 [float : left; 대 디스플레이 : 인라인; 대 디스플레이 : 인라인 블록; 대 디스플레이 : 표 셀;] (http://stackoverflow.com/questions/11805352/floatleft-vs-displayinline-vs-displayinline-block-vs-displaytable-cell) –

Should You Use Inline-Blocks As A Substitute For Floats을 참조하십시오. 그것은 당신을 많이 도울 것입니다.

출처

2013-04-02 06:31:39 Sachin

정말 대단히 유용한 기사에 감사드립니다. –

-2

레이아웃의 경우 사용하지 않아야합니다.

http://www.w3schools.com/cssref/pr_class_display.asp#gsc.tab=0에 따르면 모든 인라인 속성은 인터넷 Explorer 8+에 의해 지원되므로 상업용 웹 사이트를 개발하지 않는 것이 좋습니다.

<header> 및 <article>과 같은 <div> 및 HTML5 요소를 사용하는 것이 좋습니다. 예를 들어,

<body> 
    <header> 
    <div id="logo"> 
     <img src="myLogo.png" alt="logo"/> 
    </div> 
    <nav> 
    </nav> 
    </header> 
    <div id="pageContainer"> 
    <article> 
     <section> 
     ... 
     </section> 
    </article> 
    </div> 
</body>

다음 각 <div> 개별 요소에는 인라인 정의하거나 (그림 또는 테이블 등) 로트.

<div> : 기본적으로 웹 페이지의 섹션. 달콤한 HTML5 요소의

목록! : http://www.w3schools.com/html/html5_new_elements.asp#gsc.tab=0

예 : 대신 당신이 IE의 지원이 정말 걱정하는 경우 CSS 레이아웃의 http://jsfiddle.net/JYZhz/

출처

2013-04-02 06:35:58

한편으로는 상용 사이트가 없으면'inline-block'을 사용하는 것이 좋습니다. 반면에 html5 요소를 사용하는 것이 좋습니다 (IE를 지원하지 않는 IE에서 사용되는 경우). 지원되지 않는'인라인 블록 (inline-block) '을 사용하여 더 많은 레이아웃을 깨뜨릴 수 있습니다. html5와 인라인 블록 모두 IE 6 이상에서 작동하도록 수정되었습니다. 추가적인 html 요소는 레이아웃을위한 것이 아니라 의미/논리 구조를위한 것입니다. CSS는 레이아웃/스타일을위한 것입니다. –

사실, 그것을 지적하기위한 환호. 그냥 몇 가지 가정에 따라 질문에 대답했다 :) –

올바른 방법 인 인라인 블록 또는 플로트는 어느 것입니까?

답변

관련 문제