2013-08-23 1 views
0

HTML, CSS 및 부트 스트랩에 대한 기본적인 지식이 있습니다. 용어가 잘못되어 있으면 용서해주세요. 부트 스트랩 디자인의 HTML 색상을 가장자리에서 가장자리까지 만드는 방법

페이지입니다 : 대형 모니터에 http://jowoco.com/stackoverflow/scheduletech.html

(해상도> 1500px) 또는 화면을 축소 (CTRL/CMND + "-"), 당신은 색상이 그만 볼 수 있습니다. 이상적으로 앵글은 계속되지만 적어도 화면의 왼쪽과 오른쪽을 고형물로 계속 유지하는 것이 좋을 것입니다 (모의 참조).

수정 도구로 작동하는 것으로 생각되는 스크린 샷 (실제 div 또는 span인지 확실하지는 않지만)을 실제 연습에서 수행하는 방법을 잘 모르겠습니다. 여러분의 도움과 시간, Wojo에 미리

Clean screenshot illustrating the problem Annotated proposed solution - not sure how to code this in practice

정말 고마워요

답변

1

몇이 작업을 수행 할 수있는 방법 ...하지만 지금까지 가장 쉬운 선형 그라데이션을 만드는 것입니다 수 있습니다 흰색 배경이 아닌 페이지 배경.

이렇게하면 페이지 본문이 멈추더라도 가장자리에서 가장자리로 바가 갈 수 있습니다.

  1. 파란색 줄무늬의 각도가 무엇입니까 : 내가 당신에게 그것을위한 코드를 손으로 간단하게 할

    불행하게도, 당신은 아주 충분한 정보를 제공하지 않은?

  2. 브라우저 창의 크기를 조정할 때 페이지의 모양이 변경됩니까? 특히, 그 파란색 배너는 전혀 움직이지 않습니까?
  3. 어떤 브라우저를 지원해야합니까?

이 질문에 대한 답변이 있으면 여기로 놓으십시오.이 대답을 업데이트하겠습니다.

코드에서 직접 균열을 피하려면 Colorzilla에 생성하십시오. 결과 코드는 다음과 같이 표시됩니다

background: #ffffff; /* Old browsers */ 
background: -moz-linear-gradient(45deg, #ffffff 50%, #91b5b5 50%, #91b5b5 71%, #ffffff 71%); /* FF3.6+ */ 
background: -webkit-gradient(linear, left bottom, right top, color-stop(50%,#ffffff), color-stop(50%,#91b5b5), color-stop(71%,#91b5b5), color-stop(71%,#ffffff)); /* Chrome,Safari4+ */ 
background: -webkit-linear-gradient(45deg, #ffffff 50%,#91b5b5 50%,#91b5b5 71%,#ffffff 71%); /* Chrome10+,Safari5.1+ */ 
background: -o-linear-gradient(45deg, #ffffff 50%,#91b5b5 50%,#91b5b5 71%,#ffffff 71%); /* Opera 11.10+ */ 
background: -ms-linear-gradient(45deg, #ffffff 50%,#91b5b5 50%,#91b5b5 71%,#ffffff 71%); /* IE10+ */ 
background: linear-gradient(45deg, #ffffff 50%,#91b5b5 50%,#91b5b5 71%,#ffffff 71%); /* W3C */ 
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ffffff',GradientType=1); /* IE6-9 fallback on horizontal gradient */ 

이 코드는, 심지어 IE 6-9까지 파이어 폭스, 이전 및 최근 크롬 사이의 모든 브라우저를 다룹니다.

코드는 일반적으로 코드보다 훨씬 나 빠졌습니다. 파란색 막대가 나타나는 각도를 직접 설정할 수 있습니다. 예외는 IE6-9 및 이전 버전의 Chrome입니다.

이전 버전의 Chrome은 일반적으로 Chrome이 자동으로 자동 업데이트되므로 거의 존재하지 않지만 초기 Internet Explorer는 항상 문제가 될 수 있습니다.

관련 문제