1
내 asp.net 2.0 웹 양식에 jquery client side validation을 사용하려고합니다. 정상적인 입력 제출 버튼을 클릭하면 쉽게 유효성 검사가 시작될 수 있습니다.그라디언트 배경 및 배경 이미지로 버튼을 만드는 방법은 무엇입니까?
하지만 현재이 페이지에 대해 3 개의 div로 구성된 이미지 버튼을 사용하고 있으므로 자동으로 유효성 검사가 실행되지 않습니다.
나는 css3을보고 있었고 이제는 그라디언트를 지원한다는 것을 알았습니다. 버튼 오른쪽에 화살표 이미지를 표시해야한다는 점을 제외하고는 모든 것이 좋고 좋습니다.
정상적인 배경 이미지와 배경색으로 테스트하여 버튼을 설정하면 작동합니다. 하지만 나는 그라데이션 배경과 배경 이미지를 위해 똑같은 일을하는 것처럼 보이지 않습니다.
<html>
<head>
<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Droid Sans">
<style>
.button{
-webkit-gradient(
linear,
left bottom,
left top,
color-stop(0.25, rgb(88,73,229)),
color-stop(0.63, rgb(115,103,255)),
color-stop(0.82, rgb(150,134,255))
);
-moz-linear-gradient(
center bottom,
rgb(88,73,229) 25%,
rgb(115,103,255) 63%,
rgb(150,134,255) 82%
);
color:#FCD3A5;
-webkit-border-radius: 5px;
-moz-border-radius: 10px;
font: 12px;
width:140px;
line-height: 28px;
height: 28px;
font-weight: bold;
font-family:"Droid Sans",serif;
}
.orange{
background:-moz-linear-gradient(center top , #FF9300, #FF6800) repeat scroll 0 0 transparent;
border:1px solid #CFCFCF;
color:#FFFFFF;
font: 12px;
width:140px;
line-height: 28px;
height: 28px;
font-family:"Droid Sans",serif;
background-image:url(arrow_right.png);
background-repeat: no-repeat;
background-position:right;
}
.button2{
background-color:#2daebf;
background-image:url(arrow_right.png);
font: 12px;
width:140px;
line-height: 28px;
height: 28px;
font-weight: bold;
color: white;
font-family:"Droid Sans",serif;
background-repeat: no-repeat;
background-position:120px;
border: 0px;
-webkit-border-radius: 5px;
-moz-border-radius: 10px;
-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5); text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.25);
}
.button3{
background: green; /* fallback for older/unsupporting browsers */
background:-webkit-gradient(
linear,
left bottom,
left top,
color-stop(0.25, rgb(88,73,229)),
color-stop(0.63, rgb(115,103,255)),
color-stop(0.82, rgb(150,134,255))
);
background:-moz-linear-gradient(
center bottom,
rgb(88,73,229) 25%,
rgb(115,103,255) 63%,
rgb(150,134,255) 82%
);
border-top: 1px solid white;
background-image:url(arrow_right.png);
background-repeat: no-repeat;
background-position:120px;
}
</style>
</head>
<input class="button3" type="submit" value="SUBMIT"/ >
</html>
어떤 아이디어가 있습니까?
할 수 없습니까? 내 생각 엔 주변에서 확인한 결과 몇 가지 관련 질문을 찾았습니다. 하지만 지금까지 아무 해결책 : ( – melaos