CSS 분 너비 고정 및 백분율

최소 너비와 백분율을 모두 가질 수 있는지 궁금합니다. 좀 더 명확하자, 나는 다음과 같은 HTML했다 : 100 %와 600PX : 나는CSS 분 너비 고정 및 백분율

section{ 
    min-width: 100%; 
}

는 최소 폭 모두 같은이 할 수있는 방법이 있나요

<body> 
<main> 
    <section id="home-section"> 
     ...Content... 
    </section> 
    <section id="team-section"> 
     ...Content... 
    </section> 
</main> 
</body>

있나요? 뷰포트가 600px보다 작 으면 600px, 그 이상의 경우에는 100 %가됩니다. (내용 때문에 더 많을 수 있습니다.)

출처

2016-10-19 Aschab

당신은이 작업을 수행해야한다 :

section { 
    min-width: 600px; 
}

은 600PX의 최소, 자동으로 100 %입니다.

출처

2016-10-19 15:36:33

Perfect. 이상적인 대답, –

을 min-width으로 지정하면 원하는 것을 얻을 수 있습니다.

너비가 600px보다 큰 경우 섹션의 100 %를 만들고 600px보다 작을 때 600px를 만듭니다. 이는 요청한 것입니다.

CSS

section { 
    min-width: 100%; 
    width: 600px; 
}

JSFiddle

section { 
 
    min-width: 100%; 
 
    width: 600px; 
 
    background-color: yellow; 
 
}

<main> 
 
    <section id="home-section"> 
 
     ...Content... 
 
    </section> 
 
    <section id="team-section"> 
 
     ...Content... 
 
    </section> 
 
</main>

출처

2016-10-19 15:33:11

일반적인 방법은 조금 다르다. 당신은 예를 들어 정의

width: 100% 
max-width: 600px;

즉,이 작은 뷰포트에서 전체 폭을 가지고 있지만 결코 600PX

PS를 초과 할 것 방법 : 당신이 쓴

그래서 뷰포트가 작은 경우 그 600px 너비보다 600px

작은 화면에서 뷰포트보다 더 넓어 질 것입니다. 원하는대로 생각하지 않았습니까?

출처

2016-10-19 15:33:14 Johannes

영업 이익이 600px 미만의 100 %를 의미한다면 나는 또한 호기심이 많습니다. –

아니요, 맞았습니다. 현재 뷰포트보다 긴 600px에서 600px 미만의 뷰포트를 의미했습니다. – Aschab

CSS 분 너비 고정 및 백분율

답변

관련 문제