outline: none;
}
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } strong, b { font-weight: bold; }
table { border-collapse: collapse; border-spacing: 0; }
img { border: 0; max-width: 100%; }
h1 {
font-family: 'Amarante', Tahoma, sans-serif;
font-weight: bold;
font-size: 3.6em;
line-height: 1.7em;
margin-bottom: 10px;
text-align: center;
}
/** page structure **/
#wrapper {
display: block;
width: 850px;
background: #fff;
margin: 0 auto;
padding: 10px 17px;
-webkit-box-shadow: 2px 2px 3px -1px rgba(0,0,0,0.35);
}
#keywords {
margin: 0 auto;
font-size: 1.2em;
margin-bottom: 15px;
}
#keywords thead {
cursor: pointer;
background: #c9dff0;
}
#keywords thead tr th {
font-weight: bold;
padding: 12px 30px;
padding-left: 42px;
}
#keywords thead tr th span {
padding-right: 20px;
background-repeat: no-repeat;
background-position: 100% 100%;
}
#keywords thead tr th.headerSortUp, #keywords thead tr th.headerSortDown { background: #acc8dd;
}
#keywords thead tr th.headerSortUp span {
background-image: url('up.png');
}
#keywords thead tr th.headerSortDown span {
background-image: url('down.png');
}
#keywords thead tr th.sortUpBefore, #keywords thead tr th.sortDownBefore{}
#keywords tbody tr {
color: #555;
}
#keywords tbody tr td {
text-align: center;
padding: 15px 10px;
box sizing}
#keywords tbody tr td.lalign {
text-align: left;
}
点击列表头排序
KeywordsImpressionsClicksCTRRank
silly tshirts6,0001101.8%22.2desktop workspace photos2,20050022%8.9arrested development quotes13,5009006.7%12.0popular web series8,7003504%7.02013 webapps9,9使⽤⽅法:
1、html代码需要引⽤如下三个JS⽂件,⽂件包含在源码下载压缩包⾥,引⽤时要注意路径正确。
2、table头部代码结构不能改变(可添加或减少列数)
KeywordsImpressionsClicksCTRRank
上⾯代码id="keywords"不能变,不能少,和都不能改变。但可添加或减少列数。
3、css包含⼏个图⽚⽂件,⽂件包含在源码下载压缩包⾥,使⽤时注意路径正确。
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论