div가 div 인 경우 경계선 숨기기

테두리가있는 <div id="content">입니다. 이 위의 div은 다른 텍스트 인 <div id="header">입니다. 나는 국경 너머로 텍스트를 보여주고 싶지만, 나는 그것을 보이고 싶지 않다.div가 div 인 경우 경계선 숨기기

내가 여기 내 소스 코드를 게시 한 쉽게 설명은

: http://jsfiddle.net/4HSEn/이 내가 달성하고자하는 것입니다 :

enter image description here

텍스트는 동적 될 것입니다 및 배경 그라데이션이 될 것입니다. 따라서 이미지는 해결책이 아닙니다.

나는 이것을 fieldset과 태그로 달성하는 방법을 알고 있지만 div 나 다른 태그를 가진 솔루션을 찾고 있습니다. Is it possible to achieve a <fieldset>-like effect without using the <fieldset> tag?을하지만 legend에 대한 배경 컬러를 사용 :

여기에 뭔가를 발견 나를 매우 도움이되지 않습니다 #FFF :/

2012-03-20 JercSi

을 BTW. 그라디언트 배경은 IE9 http://caniuse.com/#search=gradient에서 지원되지 않습니다. 어쩌면 이미지를 사용해야 할 수도 있습니다. – Engineer

나는 IE가 많은 좋은 것들을 지원하지 않는다는 것을 안다. 나는 css3pie를 사용할 것이다 :) – JercSi

호기심, fieldset/legend 태그의 문제점은 무엇인가? – j08691

-1

는 그런 <span style="background-color: blue;"> 또는 무언가에 텍스트를 동봉합니다. 그게 효과가있다.

2012-03-20 18:46:00 uotonyh

그는 그라데이션 배경으로갑니다. 단색의 배경색이 눈에 띄게됩니다. –

테스팅되지 않은 이론이지만, 아마도 #header에 바디의 배경과 동일한 그라데이션 배경을 줄 수 있습니다. # 헤더의 배경 위치 (js 사용)와 바디에 상대적인 X 및 Y 위치를 오프셋 할 수 있습니까?

기본적으로 나는 마스킹 효과를 제안합니다.

EDIT : OP의 현재 코드 샘플에 더 부합하도록 본문과 내용을 바꿉니다.

2012-03-21 02:34:10 Jace

JS와의 솔루션에 실제로 접근했습니다. 그러나 그 때 나는 포기했다. 나는 어떤 색을 필요로하는지 계산하는 스크립트로 jsfiddle (질문에서 url)을 업데이트했다. 시간이 있으면 스크립트를 완성하고 솔루션을 게시합니다. 아이디어 +1 – JercSi

왜 음수 값으로 상단 위치를 설정하여 콘텐츠 사업부를 밀어하지 않습니다

<div id="header" style="background-color: blue;">Demo</div> <div id="content" style="top: -15px; border: 1px solid white"></div>

2012-03-21 02:52:16 arminb

답변