2016-11-19 2 views
0

나는 다음과 같은 결과를 달성하기 위해 노력하고있어 : enter image description here응답 성있는 Svg 배경을 절대 중심으로 배치하는 방법은 무엇입니까?

몸은 검은 색과 브라우저 창의 고정 된 높이를 가지고있다. 이 그래픽은 각면에 50px 여백이있는 간단한 SVG입니다. 이 비율은 브라우저 크기가 조정되면 일관성을 유지해야합니다.

+0

일관성을 유지해야하는 "비율"은 무엇입니까? 브라우저 크기가 조정됨에 따라 50 픽셀의 여백을 유지해야합니다 (검은 색 배경을 50 픽셀로 표시)? –

+0

예! 나는 svg가 약간의 검은 색이 항상 가장자리 주위에 나타나는 유동적 인 너비가되도록하고 싶다. – Trenton

답변

0

고정 폭 검은 색 테두리를 svg 사각형 주위의 선으로 구현하십시오. 그 자체는 창 전체 높이 &을 차지합니다.

<svg xmlns="http://www.w3.org/2000/svg"> 
 
    <defs> 
 
    <linearGradient id="bgGradient"> 
 
\t <stop offset="0%" stop-color="#fe7b47" /> 
 
\t <stop offset="100%" stop-color="#8cbef7" /> 
 
\t </linearGradient> 
 
    </defs> 
 
    <rect x="0" y="0" width="100vw" height="100vh" fill="url(#bgGradient)" stroke="#000000" stroke-width="100px" /> 
 
</svg>
: - 이런 식으로 뭔가 당신을위한 트릭 (페이지 별도의 파일로 나에게 코드를 복사 SNIPPIT 제대로 그래서 장소에서 실행하지 않는 그것을 reder하지 않습니다)를해야한다

관련 문제