CSS - GOOD과 비슷한 스타일?

나는 종종 GOOD라고하는 웹 사이트를 열어 나는 특히 하나의 미적 스타일을 좋아한다. 탐색 막대가 웹 사이트의 백그라운드에서 색상을 확장하는 방법 당신이 사이트를 방문하면 무슨 뜻인지 알게 될 것입니다.CSS - GOOD과 비슷한 스타일?

CSS에서 가능한 가장 간단하게 어떻게 복제 할 수 있습니까? 나는 z-index/margins/float를 사용하여 모든 종류의 것을 시도해 보았습니다.

출처

2011-08-10 Anonymous

왜 그 사이트에서 HTML과 CSS를 가져 와서 관련없는 모든 것들을 잘라 내면 어떨까요? 남은 것은 필요한 코드입니다. –

예, Chrome의 DOM 속성이나 CSSEdit 등의 도구를 사용하여 페이지 마크 업과 관련된 부분을 찾을 수 있습니다. – fluffy

@Oli, 좋은 생각입니다. –

그냥 div 안에 메뉴가있는 div (position'd 절대)를 넣고 다른 div를 그 위에 실제 내용과 함께 넣으십시오.

리틀 예 :

<html> 
<body> 
<div style="position: absolute; top:200px; left:0px; width:100%">The menu here, at A 100% width</div> 
<div style="position: absolute; top:0px; left: 0px;">The content here.</div> 
</body> 
</html>

작동합니다!

희망이 있습니다.

출처

2011-08-10 00:19:24

문제는 이제 다른 모든 것의 "뒤"에 있지 않으며 z- 인덱스가 나를 위해 작동하지 않는다는 것입니다. –

그러나 Z- 인덱스는 절대 위치 또는 상대 위치 또는 고정 위치 div가있을 때만 작동합니다. 위의 예를 사용하면 작동합니다! –

모든 대략적인 위치 : 절대. 모든 링크를 보유하고있는 nav 컨테이너에는이 CSS 속성이 주어져 페이지의 정상적인 흐름에서 제거됩니다. 최상위 위치 : 165px 위치로 설정합니다. 각 링크에는 display : block 속성이 지정됩니다.이 속성은 부모를 채우는 것을 의미합니다.이 경우 부모는이 경우 너비의 100 %입니다. span 태그는 100 % 너비 링크 내에서 텍스트를 설정하는 데 사용됩니다.

출처

2011-08-10 00:20:16

CSS - GOOD과 비슷한 스타일?

답변

관련 문제