DOCTYPE html>
<html><head><meta charset="utf-8" /><title>求签title><style type="text/css">*{ margin: 0px;padding: 0px;font-family: "微软雅黑",arial,sans-serif;}body{ background: url(img/bg.png);}div{ font-size: 10px;}.container{ width: 400px;margin: 50px auto;}.container >.title{ color: white;font-weight: bold;margin-bottom: 10px;background: -webkit-gradient(linear,left top,left bottom, from(#321def), to(#654abc), color-stop(0.5,#1a2b3c));padding: 5px 15px;font-size: 120%;text-align: center;}.date{ font-size: 17px;font-weight: bold;line-height: 30px;text-align: center;border-bottom: 1px solid #999999;}.info{ text-align: center;color: red;font-size: 9px;}.info strong{ background: crimson;color: white;padding: 0 3px;margin: 0 1px;}.check_luck{ padding-top: 10px;}.selecttable{ width: 100%;}.selecttable td{ color: white;text-align: center;padding: 10px 0;margin: 1px;background: -webkit-gradient(linear,left top,left bottom, from(#321def), to(#654abc), color-stop(0.5,#1a2b3c));cursor: pointer;width: 20%;border-radius: 2px;}.selecttable td:hover{ background: rgba(0,0,0,0.5);}/*点击时候给每个td上类的属性*/.selecttable td.selected{ background: #333333;color: #ffffff;}.roll{ height: 200px;border: 1px solid #fafafa;margin-top: 10px;overflow: hidden;position: relative;}.card{ background: white;/**/text-align: center;line-height: 200px;border-top: 1px dashed #fafafa;position: absolute;top: 201px;width: 100%;}.card.clickable{ background: crimson;color: white;cursor: pointer;}.card .title{ font-size: 70px;font-weight: bold;}style>head><body><div class="container"><div class="title">程序员求签<sup>sxtsup>div><div class="date">div><div class="info"><strong>求strong>婚丧嫁娶亲友疾病升级跳槽陨石核弹各类吉凶div><div class="check_luck"><table class="event_table selecttable"><tr><td data-event="100">编码td><td data-event="200">测试td><td data-event="300">修改bugtd><td data-event="400">提交代码td><td data-event="500">其他td>tr>table>div><div class="roll"><div class="card" style="top:-1px;font-size: 20px;">请点击所求之事div><div class="card clickable"><div class="title">求div>div>div>div><script type="text/javascript" src="js/jquery-1.4.2.min.js">script><script type="text/javascript">var weeks=["日","一","二","三","四","五","六"];var today=new Date();function getTodayString(){return "今天是"+today.getFullYear()+"年"+(today.getMonth()+1)+"月"+today.getDate()+"日"+today.getHours()+":"+today.getMinutes()+"星期"+weeks[today.getDay()];}/*时间显示到浏览器之上*/$('.date').html(getTodayString());script>body>html>
by北京尚学堂视频直播公开课的部分代码
2016-10-22晚