* { margin:0; padding:0; text-decoration:none; } html { height:100%; } body { height:100%; display:flex; justify-content:center; align-items:center; position:relative; } .boxAll { width:250px; height:120px; /* background:rgba(165,42,42,0.164); */ position:relative; } .pac-man { width:100px; height:100px; background:rgb(215,52,88); position:absolute; top:10px; left:10px; border-radius:50%; clip:rect(0,50px,100px,0); } .pac-man-mouth0 { width:100px; height:100px; position:absolute; top:10px; left:10px; border-radius:50%; background:rgb(215,52,88); clip:rect(0,100px,50px,0); /* transform:rotate(0deg); */ /* transform:rotate(-35deg); */ } .pac-man-mouth1 { width:100px; height:100px; position:absolute; top:10px; left:10px; border-radius:50%; background:rgb(215,52,88); clip:rect(50px,100px,100px,0); /* transform:rotate(35deg); */ } .beans { width:190px; height:20px; position:absolute; left:60px; top:50px; overflow:hidden; z-index:-999; } .radNull { width:20px; height:20px; float:left; } .radBody { width:300px; height:20px; float:left; } .radbox { width:auto; height:20px; float:left; /* background:rgb(255,81,0); */ } .rad0 { width:20px; height:20px; border-radius:50%; background:rgb(230,65,101); margin-right:18px; float:left; } .bottom { width:100%; height:30px; background-color:rgba(255,248,220,.5); position:absolute; bottom:0; display:flex; justify-content:center; font-size:12px; align-items:center; } .bottom a,span { color:darkgrey; margin:0 10px; } .bottom a:hover { color:#999; } .bottom a:focus { color:#999; }
更新时间:2019-10-27 23:06:13
原生代码写的吃豆人