onebook3d实现模拟书本翻页阅读效果代码
代码语言:html
所属分类:布局界面
代码描述:onebook3d实现模拟书本翻页阅读效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!--必要样式--> <style type="text/css"> html,body { width: 100%; margin: 0px; padding: 0px; background: #e0604a; color: #000000; min-width: 800px; } body * { -webkit-tap-highlight-color: rgba(0,0,0,0); } .links a:link,.links a:visited { color: black; text-decoration: none; font: 20px sans-serif; } .links a:hover { color: black; text-decoration: underline; } .red { border: 1px solid #ffc30d; } .red-filled { background: #e0604a; border: 1px solid #ffc30d; } .blue { background: #67BCCF; } .section { width: 800px; border-radius: 10px; margin: 50px auto; } .section p { text-align: center; margin: 0px; padding: 20px; font: 16px sans-serif; line-height: 140%; } .section p strong { color: gold; } .section-list { width: 800px; border-radius: 10px; margin: 50px auto; } .address { margin: 0px auto 50px auto; padding: 0px; width: 800px; text-align: center; } .address, .address a { font: 16px arial, sans-serif; color: black; } </style> </head> <body> <div class="zzsc-container"> <div class="section red"> <div style="padding:30px;"> <div id="photobook" style="height:100px;"></div> </div> </div> <div class="section-list blue"> <div style="padding:30px;" class="links"> <p> <a href="#"><strong>1. Example,</strong> language (italian), </a> </p> <p> <a href="#"><strong>2. Example,</strong> border (100), pageColor:(green), image on background</a> </p> <p> <a href="#"><strong>3. Example,</strong> border (10), slope(1), startPage(4), flip (basic) </a> </p> </div> &l.........完整代码请登录后点击上方下载按钮下载查看
网友评论0