2011-10-10 5 views
2

HTML 5 및 외부 css3 스타일 시트를 사용하여 웹 페이지를 만듭니다.div in css3 file

Ive는 둥근 모서리 상자를 표시하도록 div를 만들었습니다. css div 코드가 html 문서에 있으면 잘 표시됩니다. 하지만 css3 스타일 시트로 전송하면 상자가 사라집니다. 필자는 지금 두세 시간 동안의 답변을 찾고 있었고 잘못 된 것을 해결할 수 없었습니다.

여기 ...

<style type="text/css"> 
div 
{ 
    border:8px solid #000000; 
    padding:10px 10px; 
    background:#ffffff; 
    width:500px; 
    margin: auto; 
    border-radius:25px; 
    -moz-border-radius:25px; /* Firefox 3.6 and earlier */ 
} 
</style> 

</head> 
<body> 

<div><h1>WELCOME TO THE WEBSITE</h1></div> 

내 HTML 코드입니다하지만 최대한 빨리 내 CSS 파일에 이상이 부분

div 
{ 
    border:8px solid #000000; 
    padding:10px 10px; 
    background:#ffffff; 
    width:500px; 
    margin: auto; 
    border-radius:25px; 
    -moz-border-radius:25px; /* Firefox 3.6 and earlier */ 
} 

를 이동하고 HTML 파일에서 을 제거한다.

div 상자가 사라집니다. css 파일에 정의 된 다른 모든 요소가 제대로 표시되므로 파일이 링크 된 것입니다. 나는 왜이 div가 전시하지 않을지 모른다.

답장을 보내 주셔서 감사합니다. 전체 CSS 코드는 브라우저가 스타일 시트의 이전 버전을 캐싱 것처럼 질문에서 말한 모든 것을 감안할 때

body 
{ 
background-image:url(roses.png); 
background-repeat:repeat top; 
background-colour:#ffffff; 
background-attachment:scroll; 
} 

h1 
{ 
text-shadow: 2px 2px 2px #efefef; 
} 

div 
{ 
border:8px solid #000000; 
padding:10px 10px; 
background:#ffffff; 
width:500px; 
margin: auto; 
border-radius:25px; 
-moz-border-radius:25px; /* Firefox 3.6 and earlier */ 
} 

#para1 
{ 
text-align:center; 
color:red; 
} 
+0

스타일 시트를 게시하십시오. 문제가있을 가능성이 큽니다. – Jimmy

+0

문제의 가능한 원인으로 스타일 시트에서 다른 스타일을 제거하려고 했습니까? – Spudley

+0

그래, 그랬어. 나는 스타일 시트를 저장하고 되돌리기로 제거한 물건을 다시 가져올 수 없으므로 모든 것을 다시 작성해야했습니다. Ive도 div에 ID와 클래스를 제공하려고 시도했지만 아무 것도 변경되지 않았습니다. – Will

답변

1

, 그것은 나에게 소리입니다.

방화 벽을 점검하여 스타일 시트에 무엇이 있다고 생각하는지 확인하십시오.

스타일 시트의 URL을 브라우저 창에 직접로드하고 필요하면 새로 고침하고 새 코드가 제자리에 있는지 확인하십시오.

내가 생각할 수있는 유일한 다른 가능성은 스타일 시트 코드 끝에 스타일의 구문 분석을 방해하는 오류가 있다는 것입니다.

가능하지만 전체 CSS 코드를 보지 않고 확인할 수는 없습니다.

0

전체 코드를 보지 못해서 확신 할 수는 없지만 CSS에서 변경해야 할 것은 둥근 테두리와 관련된 두 줄의 순서입니다.

뒤에 항상 border-radius의 지시어를 지정해야합니다. 즉, -moz-border-radius:25px 행이 먼저 도착해야합니다.

이 시나리오가 다른 시나리오와 다른 시나리오에서 작동하지 않는 이유는 확실하지 않지만 거기에는 이상한 점이 있습니다. 어떤 브라우저를 미리보고 있습니까?

+0

안녕하세요, 답장을 보내 주셔서 감사합니다.Firefox 7을 사용하여 페이지를 봅니다. 또한 누군가가 각 div에게 자신의 ID를 제공하는 방법을 말해 줄 수 있습니다. Ive는 .divname과 div.divname을 시도했지만 둘 다 작동하지 않습니다. – Will

+0

Ive는 div의 이름을 지정하는 방법을 알아 냈지만 여전히 CSS 파일에서 작업하도록해야합니다. ( – Will

+0

내 게시물마다 CSS를 편집 해 보았습니까? Firebug (또는 유사) 페이지를 검토하여 올바른 CSS가로드되고 있습니까? – Ben

0

필자는 div에 별도의 이름을 지정 했으므로 이제는 CSS 파일 내에서 모든 것이 정상적으로 작동하는 것으로 보입니다. 행복한 날 :)