Home > Developer > Web Develop
<meta charset= "Utf-8" content= "TEXT/HTNL" >
<title>button</title>
<style type= "Text/css" >
a.button{
position:relative;
width:80px;
height:50px;
background-color:red;
Display:block;
Text-align:center;
margin:100px Auto;
border-radius:8px;
box-shadow:0px 9px 0px Rgba (219,31,5,1), 0px 9px 9px #333;
Text-decoration:none;
}
a.button:active {
position:relative;
width:80px;
height:80px;
background-color:red;
Display:block;
Text-align:center;
margin:100px Auto;
border-radius:8px;
box-shadow:0px 2px 0px Rgba (219,31,5,1), 0px 2px 9px #333;
Text-decoration:none;
}
</style>
<body>
<!--a 3D button, the simplest part---
<a class= "button" href= "" >click</a>
<!--extract the value of a radio box and check box--
<form action= "" >
<input type= "Radio" name= "Radio" value= "1" >1
<input type= "Radio" name= "Radio" value= "2" >2
<input type= "button" onclick= "Singlechk ()" value= "Submit" >
</form>
<form action= "" >
<input type= "checkbox" name= "checkbox" value= "one" >11
<input type= "checkbox" name= "checkbox" value= ">12"
<input type= "checkbox" name= "checkbox" value= ">13"
<input type= "button" onclick= "Chk ()" value= "Submit" >
</form>
</body>
<script type= "Text/javascript" >
function Chk () {
var value= "";
var obj=document.getelementsbyname (' checkbox ');
for (var i=0; i<obj.length;i++) {
if (obj[i].checked) {
if (i==obj.length-1)
Value+=obj[i].value;
Else value+=obj[i].value+ "and";
}
}
alert ("You have chosen:" +value);
}
function Singlechk () {
var s= "";
var obj=document.getelementsbyname (' Radio ');
for (var i=0;i<obj.length;i++) {
if (obj[i].checked)
S+=obj[i].value;
}
alert ("You have chosen:" +s);
}
</script>
Self-study--js extract the value of the check box and the Radio box and the 3D button of the pure CSS
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
