<form id="htvdb"></form>

            <form id="htvdb"><nobr id="htvdb"></nobr></form>

              <address id="htvdb"></address>

              <form id="htvdb"><form id="htvdb"><nobr id="htvdb"></nobr></form></form>
              <form id="htvdb"></form>


                    51rgb-css3动画14-css3制作星星评分功能

                    分享 :

                    网盘下载链接:

                    提取密码: u4qi
                    复制提取密码
                    51RGB在线教育,WEB前端开发直播体验课,css3制作星星评分功能!源码下载
                    • 详情
                      文件来源

                      官方发布

                      更新日期

                      2018-01-26

                      适用平台

                      All

                      系统位数

                      ALL

                      文件格式

                      zip

                      文件语言

                      中文

                      文件授权

                      免费

                      下载次数

                      415次

                      源码,可以直接复制使用!

                      <!DOCTYPE html>
                      <html lang="zh-CN">
                       <head>
                        <meta charset="UTF-8" />
                        <meta name="Keywords" content="" />
                        <meta name="Description" content="" />
                        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
                        <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no" />
                        <title>纯css3星星评分</title>
                        <style>
                         form{width:90%;max-width:200px;margin:0 auto;}
                          h2{text-align:center;margin-top:5em;}
                          .chrome{margin-bottom:4em;}
                          .chrome>input{position:relative;margin-right:1em;border:0;background:transparent;color:gold;-webkit-transition:color .8s;
                            transition:color .8s;}
                          .chrome>input:nth-of-type(1){display:none;}
                          .chrome>input:before{position:absolute;content:"★";left:0;top:0;font-size:32px;height:100%;width:100%;background:#FFF;cursor:pointer;}
                          .chrome>input:checked~input{color:#666;}
                      
                          .all>input{opacity:0;position:absolute;width:2em;height:2em;margin:0;cursor:pointer;}
                          .all>input:nth-of-type(1),
                          .all>span:nth-of-type(1){display:none;}
                          .all>span{font-size:2em;color:gold;
                            -webkit-transition:color .8s;
                            transition:color .8s;
                          }
                          .all>input:checked~span{color:#666;}
                          .all>input:checked+span{color:gold;}
                        </style>
                       </head>
                       <body>
                        <h2>纯css3星星评分</h2>  
                        <form>
                         hugeannex设计<br /><br />
                           chrome:
                          <p class="chrome">
                            <input type="radio" name="a" value="0" checked="checked" />
                            <input type="radio" name="a" value="1" />
                            <input type="radio" name="a" value="2" />
                            <input type="radio" name="a" value="3" />
                            <input type="radio" name="a" value="4" />
                            <input type="radio" name="a" value="5" />
                          </p>
                      
                          css3兼容:
                          <p class="all">
                            <input type="radio" name="b" value="0" checked="checked" />
                            <span>★</span>
                            <input type="radio" name="b" value="1" />
                            <span>★</span>
                            <input type="radio" name="b" value="2" />
                            <span>★</span>
                            <input type="radio" name="b" value="3" />
                            <span>★</span>
                            <input type="radio" name="b" value="4" />
                            <span>★</span>
                            <input type="radio" name="b" value="5" />
                            <span>★</span>
                          </p>    
                        </form>
                      <!--原文链接 http://www.w3cfuns.com/notes/11445/e7aee4ec375393f7ce3951ad1a93e151.html -->
                       </body>
                      </html>
                      
                      
                    • 使用说明

                      本节课视频资源:

                      课程在线回放地址:http://www.gonooa.com/video/page-29/281.html

                      关注微信公众号:网页设计自学平台 回复:【css3动画】关键字即可获取全套css3动画教程及源码

                    • 相关下载
                    北京赛车玩法和赔率|官网_首页