CSS 버튼 스타일이 적용되지 않습니다.

Question

스타일을 구현하는 데 문제가 있습니다. CSS3를 사용했습니다. 로컬로, 내가 그것을 시도 할 때, 그것이 정상적으로 작동하지만, 스타일은 거기에 있지만 내가 그것을 호스팅 할 때 스타일을 적용하지 않는다. 내가 포함한 여러 웹 사이트에서 읽은 내용에 따라 다른 일을 시도했습니다

.btn { 
    background: #3498db; 
    background-image: -webkit-linear-gradient(top, #3498db, #2980b9); 
    background-image: -moz-linear-gradient(top, #3498db, #2980b9); 
    background-image: -ms-linear-gradient(top, #3498db, #2980b9); 
    background-image: -o-linear-gradient(top, #3498db, #2980b9); 
    background-image: linear-gradient(to bottom, #3498db, #2980b9); 
    -webkit-border-radius: 5; 
    -moz-border-radius: 5; 
    border-radius: 5px; 
    -webkit-box-shadow: 0px 1px 3px #666666; 
    -moz-box-shadow: 0px 1px 3px #666666; 
    box-shadow: 0px 1px 3px #666666; 
    font-family: Arial; 
    color: #ffffff; 
    font-size: 20px; 
    padding: 15px 25px 15px 25px; 
    border: solid #1f628d 1px; 
    text-decoration: none; 
} 

.btn:hover { 
    background: #3cb0fd; 
    background-image: -webkit-linear-gradient(top, #3cb0fd, #3498db); 
    background-image: -moz-linear-gradient(top, #3cb0fd, #3498db); 
    background-image: -ms-linear-gradient(top, #3cb0fd, #3498db); 
    background-image: -o-linear-gradient(top, #3cb0fd, #3498db); 
    background-image: linear-gradient(to bottom, #3cb0fd, #3498db); 
    text-decoration: none; 
} 

:

여기

<button id="liveButton" class="btn" style="padding: 10px;">Livestream</button> 

내가 스타일 시트에있는 내용은 다음과 같습니다 여기

내가 HTML 파일에 무엇을 사용 이 사이트의 일부는 표시되지만 표시되지는 않습니다. 일반적으로 Blue Button이 표시되어야하지만 사이트에는 Generic/Default 종류의 버튼 만 표시됩니다.

이에 대한 통찰력을 찾으십시오. 감사!

업데이트 업로드 한 디렉토리의 비밀번호를 삭제하여 문제를 해결했습니다. 암호로 보호 되었기 때문에 작동하지 않는 것 같습니다. 그러나 그것은 내가 그것을 제거한 후에 나를 위해 Button을위한 스타일을 보여주었습니다.

Answer 1

코드가 올바르게 작동합니다. 질문을 제출하기 전에이 내용을 읽으십시오 : How to create a Minimal, Complete, and Verifiable example.

• 최소 - 여전히 같은 문제를 생산하고 가능한 한 적은 코드를 사용
• 전체 - 문제를 재현하는 데 필요한 모든 부품을 제공
• 검증 가능한 - 테스트 당신에게 제공하려고하고있는 코드 있는지 확인이 문제

.btn { 
 
    background: #3498db; 
 
    background-image: -webkit-linear-gradient(top, #3498db, #2980b9); 
 
    background-image: -moz-linear-gradient(top, #3498db, #2980b9); 
 
    background-image: -ms-linear-gradient(top, #3498db, #2980b9); 
 
    background-image: -o-linear-gradient(top, #3498db, #2980b9); 
 
    background-image: linear-gradient(to bottom, #3498db, #2980b9); 
 
    -webkit-border-radius: 5; 
 
    -moz-border-radius: 5; 
 
    border-radius: 5px; 
 
    -webkit-box-shadow: 0px 1px 3px #666666; 
 
    -moz-box-shadow: 0px 1px 3px #666666; 
 
    box-shadow: 0px 1px 3px #666666; 
 
    font-family: Arial; 
 
    color: #ffffff; 
 
    font-size: 20px; 
 
    padding: 15px 25px 15px 25px; 
 
    border: solid #1f628d 1px; 
 
    text-decoration: none; 
 
} 
 

 
.btn:hover { 
 
    background: #3cb0fd; 
 
    background-image: -webkit-linear-gradient(top, #3cb0fd, #3498db); 
 
    background-image: -moz-linear-gradient(top, #3cb0fd, #3498db); 
 
    background-image: -ms-linear-gradient(top, #3cb0fd, #3498db); 
 
    background-image: -o-linear-gradient(top, #3cb0fd, #3498db); 
 
    background-image: linear-gradient(to bottom, #3cb0fd, #3498db); 
 
    text-decoration: none; 
 
}

<button id="liveButton" class="btn" style="padding: 10px;">Livestream</button>

,129,373를 재현