윈도우 10에서 버튼이 제대로 안나옵니다
본문
그누 퍼블리셔 팁에서 보았던 링크인데요
http://livetools.uiparade.com/button-builder.html#
여기서 버튼을 적용했는데
윈도우 10에서는 버튼이 정상적으로 안나오네요?
이 버튼싸이트는 적용하면 안되는건가요?
정상적인거
윈도우 10일경우
제가 윈도우10이 아니라서 테스트가 어려운데
.button {
border: 1px solid #0a3c59;
background: #3e779d;
background: -webkit-gradient(linear, left top, left bottom, from(#65a9d7), to(#3e779d));
background: -webkit-linear-gradient(top, #65a9d7, #3e779d);
background: -moz-linear-gradient(top, #65a9d7, #3e779d);
background: -ms-linear-gradient(top, #65a9d7, #3e779d);
background: -o-linear-gradient(top, #65a9d7, #3e779d);
background-image: -ms-linear-gradient(top, #65a9d7 0%, #3e779d 100%);
padding: 10.5px 21px;
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;
-webkit-box-shadow: rgba(255,255,255,0.4) 0 1px 0, inset rgba(255,255,255,0.4) 0 1px 0;
-moz-box-shadow: rgba(255,255,255,0.4) 0 1px 0, inset rgba(255,255,255,0.4) 0 1px 0;
box-shadow: rgba(255,255,255,0.4) 0 1px 0, inset rgba(255,255,255,0.4) 0 1px 0;
text-shadow: #7ea4bd 0 1px 0;
color: #06426c;
font-size: 14px;
font-family: helvetica, serif;
text-decoration: none;
vertical-align: middle;
}
.button:hover {
border: 1px solid #0a3c59;
text-shadow: #1e4158 0 1px 0;
background: #3e779d;
background: -webkit-gradient(linear, left top, left bottom, from(#65a9d7), to(#3e779d));
background: -webkit-linear-gradient(top, #65a9d7, #3e779d);
background: -moz-linear-gradient(top, #65a9d7, #3e779d);
background: -ms-linear-gradient(top, #65a9d7, #3e779d);
background: -o-linear-gradient(top, #65a9d7, #3e779d);
background-image: -ms-linear-gradient(top, #65a9d7 0%, #3e779d 100%);
color: #fff;
}
.button:active {
text-shadow: #1e4158 0 1px 0;
border: 1px solid #0a3c59;
background: #65a9d7;
background: -webkit-gradient(linear, left top, left bottom, from(#3e779d), to(#3e779d));
background: -webkit-linear-gradient(top, #3e779d, #65a9d7);
background: -moz-linear-gradient(top, #3e779d, #65a9d7);
background: -ms-linear-gradient(top, #3e779d, #65a9d7);
background: -o-linear-gradient(top, #3e779d, #65a9d7);
background-image: -ms-linear-gradient(top, #3e779d 0%, #65a9d7 100%);
color: #fff;
}
무엇때문에 효과가 안나타나는걸까여?
다른 혹시 최신윈도우 상관없이 나오는 싸이트 괜찮은건 없을까요??
!-->
답변 5
웹은 윈도우랑 상관이 없습니다.
어떤 브라우져를 사용했는지 알아야 합니다.
짐 링크를 보니 엣지에서는 아주 잘나옵니다.
IE하위버전 같은데 브라우져 버전을 먼저 체크해보세요
IE도 버전별로 다양하게 있습니다.
윈도우 10이면 IE 버전이 11일텐데요
저는 잘나옵니다.
버전확인은 여기서
P.S 버튼이 이상하게 나온다는 사이트는 위링크가 아닌 질문하신분의 사이트 일텐데요
사이트 링크는 다른 css가 없기에 잘나올꺼고 님사이트는 다른 CSS와의 중복이나 겹침문제로
틀리게 보여질수 있습니다.
이런식의 컴퓨터라고 해야되나요?
물론 크롬은 잘나오고요
그림에서 맨 오른쪽 익스플로어인데
다 최신컴퓨터고요
제가 2개를 확인했는데 다 회색으로 나오고
인터넷에 물어봐도
사람들이 회색으로 보인다해서여
잘보이는 사람도 있지만여
background: -webkit-gradient(linear, left top, left bottom, from(#3e779d), to(#3e779d));
top이 아니라 to라고 되어있는거같네요. 일단 오류 1개 발견요 ㅎ