创建函数，事件触发改变样式
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
</head>
<body>
<script type="text/javascript">
function ok1(y){
y.style.borderRadius="80px"
y.style.background="red"
}//创建函数OK1 改变边框与颜色
function ok2(x){
x.style.borderRadius="80px"
x.style.background="pink"
}
function ok3(z){
z.style.background="pink"
}
</script>
<div style="width:200px; height: 200px; border:1px solid #ccc;" onclick="ok1(this)"></div>// DIV中初始宽高为200PX，通过ONCLICK事件触发引用了创建函数ok1改变了样式
<div style="width:180px; height:180px; border:1px solid #aaa;" onclick="ok2(this)"></div>
<div style="height: 180px;width: 126px;display:block;background-color: #FFC78E;-webkit-border-radius: 63px 63px 63px 63px / 108px 108px 72px 72px;border-radius:50% 50% 50% 50% /60%60%40%40%; "onclick="ok2(this)"></div>
</html>