草履蟲黑板 。 測試版

/*游標(上:原型 下:碰到連結時的效果)*/

body{cursor:crosshair;}

a:hover{cursor:crosshair;}

/*上方快捷列(上:原型 下:游標移上去時的效果)*/

.topbar {

opacity:.5;

-moz-opacity:.5;

filter:alpha(opacity=50);

-webkit-transition:all .5s ease-in-out;

-moz-transition:all .5s ease-in-out;

-o-transition:all .5s ease-in-out;

-ms-transition:all .5s ease-in-out;}

.topbar:hover {

opacity:.7;

-moz-opacity:.7;

filter:alpha(opacity=70);

-webkit-transition:all .5s ease-in-out;

-moz-transition:all .5s ease-in-out;

-o-transition:all .5s ease-in-out;

-ms-transition:all .5s ease-in-out;}

/*橫幅*/

#header {

opacity:.8;

-moz-opacity:.8;

filter:alpha(opacity=80);

-webkit-transition:all .5s ease-in-out;

-moz-transition:all .5s ease-in-out;

-o-transition:all .5s ease-in-out;

-ms-transition:all .5s ease-in-out;

width:655px;

height:300px;

background:url(http://i.imgur.com/b6U6uX8.png) no-repeat left top;

color:#85a5b1;

}

#header:hover {

opacity:1;

-moz-opacity:1;

filter:alpha(opacity=100);

-webkit-transition:all .5s ease-in-out;

-moz-transition:all .5s ease-in-out;

-o-transition:all .5s ease-in-out;

-ms-transition:all .5s ease-in-out;

width:655px;

height:300px;

background:url(http://i.imgur.com/b6U6uX8.png) no-repeat left top;

color:#85a5b1;

}

/*背景圖片*/

body {

font-size:9px;

font-family:verdana;

letter-spacing:1px;

line-height:18px;

background:url(http://i.imgur.com/UAlMUfM.png) no-repeat;

color:#838383;

background-repeat:repeat;

background-position:undefined;

background-attachment:fixed;

}

.modal-footer{display: none;}

.idle-adsense{display: none;}

.idle-related-posts{display: none;}

.modal-dialog{top: 50% !important; margin-top: -100px !important;}

Pseudo ::selection element

::selection {

    font-family: 微軟正黑體;

    background: #c9d9e8;

    color: #FFF;}

#user-info .box-text {

    padding-left: px;}

.box-text {

    padding: 5px;

    margin-left: 25px;}

#user-info dl {

    font-family: 微軟正黑體;clear: both;}

element.style {font-family: 微軟正黑體;}

#category h6 {

    font-family: 微軟正黑體;

    padding-left: 15px;}

.box-title:hover {

    letter-spacing: 5pt;

    -webkit-transition: all .5s ease-in-out;

    -moz-transition: all .5s ease-in-out;

    -o-transition: all .5s ease-in-out;

    -ms-transition: all .5s ease-in-out;

    width: 200px;

    height: 18px;

    color: #9dbc9f;

    padding: 0 10px;

    font-size: small;

    font-family: 微軟正黑體;}

.box-title {

    font-family: 微軟正黑體;

    font-size: small;

    -webkit-transition: all .5s ease-in-out;

    -moz-transition: all .5s ease-in-out;

    -o-transition: all .5s ease-in-out;

    -ms-transition: all .5s ease-in-out;

    width: 200px;

    height: 18px;

    color: #9dbc9f;

    padding: 0 10px;}

.topbar__logo a:after {

    content: "";

    width: 74px;

    height: 30px;

    margin: auto;

    background: url(http://i.imgur.com/sofD3Xx.png) -10px -35px no-repeat;

    -webkit-transition: all .5s ease-in-out;

    -moz-transition: all .5s ease-in-out;

    -o-transition: all .5s ease-in-out;

    -ms-transition: all .5s ease-in-out;}

.topbar__announce__item {

    position: absolute;

    max-width: 250px;

    color: #91A1C7;

    margin-top: 0;

    -webkit-transition: all .3s;

    transition: all .3s;}

.topbar__announce__item, .topbar__search__suggestion__item {

    white-space: nowrap;

    text-overflow: ellipsis;

    overflow: hidden;}

.topbar__search__submit:hover {

    background-color: rgba(0,0,0,0);

    -webkit-transition: all .5s ease-in-out;

    -moz-transition: all .5s ease-in-out;

    -o-transition: all .5s ease-in-out;

    -ms-transition: all .5s ease-in-out;}

.topbar__search__submit {

    -moz-transition: all .5s ease-in-out;

    -o-transition: all .5s ease-in-out;

    -ms-transition: all .5s ease-in-out;

    width: 70px;

    display: block;

    line-height: 30px;

    margin: 0;

    padding: 0;

    border: none;

    color: #FFFFFF;

    background-color: #2D5E77;

    cursor: pointer;

    letter-spacing: 1px;

    font-family: inherit;}

.topbar__search__btns:before {

    top: 0;

    height: 30px;

    background: #2D5E77;}

.topbar__search__submit {

    width: 70px;

    display: block;

    line-height: 30px;

    margin: 0;

    padding: 0;

    border: none;

    color: #FFFFFF;

    background-color: #2D5E77;

    cursor: pointer;

    letter-spacing: 1px;

    font-family: inherit;}

.topbar__notification__counter.no-notification:after {

    background-color: #1E4467;}

.topbar__user__avator__img {

    border-radius: 50%;

    border: 2px solid rgba(0,0,0,0);

    margin-left: -20px;}

.topbar__user:hover .topbar__user__avator__img {

    -webkit-box-shadow: 0 0 2px 2px #14477B;

    box-shadow: 0 0 2px 2px #14477B;}

.topbar__lang a:hover, .topbar__lang__lists a:hover, .topbar__user a:hover {

    color: #A7BBEA;

    opacity: .5;

    -moz-opacity: .5;

    filter: alpha(opacity=50);

    -webkit-transition: all .5s ease-in-out;

    -moz-transition: all .5s ease-in-out;

    -o-transition: all .5s ease-in-out;

    -ms-transition: all .5s ease-in-out;}

.topbar a:hover {

    background-color: transparent;

    opacity: .5;

    -moz-opacity: .5;

    filter: alpha(opacity=50);

    -webkit-transition: all .5s ease-in-out;

    -moz-transition: all .5s ease-in-out;

    -o-transition: all .5s ease-in-out;

    -ms-transition: all .5s ease-in-out;}

a:hover {

    color: #acd1d1;}

a:hover {

    cursor: crosshair;}

.topbar__lang a, .topbar__lang__lists a, .topbar__user a {

    display: block;

    line-height: 40px;

    color: #000;

    opacity: .5;

    -moz-opacity: .5;

    filter: alpha(opacity=50);

    -webkit-transition: all .5s ease-in-out;

    -moz-transition: all .5s ease-in-out;

    -o-transition: all .5s ease-in-out;

    -ms-transition: all .5s ease-in-out;}

 #visitor .box-text li{display:inline-block;}

ol,ul {list-style:none;}

 #banner .skiplink{display:none;}

#visitor a img {

width: 20px; height: 20px; padding: 1px; border: 1px dashed #;

opacity:.3;

-moz-opacity:.3;

filter:alpha(opacity=30);

-webkit-transition:all .5s ease-in-out;

-moz-transition:all .5s ease-in-out;

-o-transition:all .5s ease-in-out;

-ms-transition:all .5s ease-in-out; }

#visitor a:hover img {

width: 30px; height: 30px; padding: 1px; border: 1px dashed #;

 opacity:.7;

-moz-opacity:.7;

filter:alpha(opacity=70); position: relative; left: 1px; top: 1px;

-webkit-transition:all .5s ease-in-out;

-moz-transition:all .5s ease-in-out;

-o-transition:all .5s ease-in-out;

-ms-transition:all .5s ease-in-out;}

::selection {background:#c9d9e8;color:#FFF;}

::-moz-selection {background:#c9d9e8;color:#FFF;}

#links-row-1 > div:first-child {

margin-top:-999em!important;

position:absolute;

z-index:0;

}

table {

border-collapse:collapse;

border-spacing:0;

}

address,caption,cite,code,dfn,em,th,var {

font-style:normal;

font-weight:normal;

}

caption,th {

text-align:left;

}

h1,h2,h3,h4,h5,h6 {

font-size:100%;

font-weight:normal;

}

q:before,q:after {

content:'';

}

pre {

font-size:1em;

}

.article-content p {

line-height:20px;

margin:20px 20px 1em;

}

body br {

letter-spacing:0;

}

a {

text-decoration:none;

color:#9dbc9f;

}

a:hover {

color:#acd1d1;

}

#body-div {

position:relative;

width:1000px;

margin:10px auto;

}

#container {

background:url() repeat-y left;

overfloat:auto;

}

#login-bar {

position:absolute;

width:616px;

top:-10px;

left:0;

text-align:center;

}

#banner h1 a {

position:absolute;

top:0;

left:675px;

height:1000px;

line-height:30px;

width:35px;

overflow:hidden;

font-weight:bold;

color:#FFF;

writing-mode:tb-rl;

font-size:30px;

font-family:微軟正黑體;

}

#banner h2 {

background: #ffffff;

position:absolute;

top:-10px;

left:735px;

height:200px;

line-height:18px;

width:225px;

overflow:hidden;

color:#a8bbc3;

font-size:12px;

padding: 10px 20px;

border-radius: 10px;

overflow:auto;

overflow-x:hidden;

scrollbar-arrow-color:#ea5506;

scrollbar-face-color:#ffffff;

scrollbar-track-color:#ea5506;

scrollbar-3dlight-color:#ffffff;

scrollbar-highlight-color:#ffffff;

scrollbar-shadow-color:#ffffff;

scrollbar-darkshadow-Color:#ffffff;

border:0px dotted #ea5506;

}

#blog-category {

position:absolute;

top:20px;

left:15px;

font-size:0;

}

(全站分類)

#navigation {

position:absolute;

top:22px;

left:295px;

width:200px;

height:14px;

font-size:0;

}

#navigation li {

float:left;

}

#navigation a {

width:50px;

height:14px;

display:block;

font-size:0;

text-indent:-9999px;

}

#authority {

position:absolute;

top:22px;

left:495px;

width:100px;

height:14px;

}

#authority a {

float:left;

width:50px;

height:14px;

display:block;

font-size:0;

text-indent:-9999px;

}

#content {

opacity:.5;

-moz-opacity:.5;

filter:alpha(opacity=50);

-webkit-transition:all .5s ease-in-out;

-moz-transition:all .5s ease-in-out;

-o-transition:all .5s ease-in-out;

-ms-transition:all .5s ease-in-out;

width:655px;

height:auto;

float:left;

display:inline;

overflow:hidden;

background-color:#fff;

margin:0 18px 0 0;

}

#content:hover {

opacity:1;

-moz-opacity:1;

filter:alpha(opacity=100);

-webkit-transition:all .5s ease-in-out;

-moz-transition:all .5s ease-in-out;

-o-transition:all .5s ease-in-out;

-ms-transition:all .5s ease-in-out;

width:655px;

height:auto;

float:left;

display:inline;

overflow:hidden;

background-color:#fff;

margin:0 18px 0 0;

}

#spotlight {

width:655px;

height:auto;

padding-bottom:5px;

margin-top:-40px;

}

#spotlight h5 {

padding-bottom:5px;

color:#abbfbc;

font-weight:bold;

}

.article-head {

background:url() no-repeat -1px bottom;

}

.publish {

line-height:10px;

height:10px;

text-align:right;

font-size:12px;

font-family:century gothic;

color:#9dbc9f;

padding:0 10px;

}

.title a {

-webkit-transition:all .5s ease-in-out;

-moz-transition:all .5s ease-in-out;

-o-transition:all .5s ease-in-out;

-ms-transition:all .5s ease-in-out;

height:30px;

line-height:18px;

font-size:20px;

overflow:hidden;

color:#2d9f51;

font-family:微軟正黑體;

}

.title a:hover {

letter-spacing:6pt;

-webkit-transition:all .5s ease-in-out;

-moz-transition:all .5s ease-in-out;

-o-transition:all .5s ease-in-out;

-ms-transition:all .5s ease-in-out;

height:30px;

line-height:18px;

font-size:20px;

overflow:hidden;

color:#7298ab;

font-family:微軟正黑體;

}

.title img {

vertical-align:middle;

}

.article-body {

padding:10px;

}

.more {

float:right;

display:inline;

margin:10px 0;

}

.more a {

width:40px;

height:20px;

display:block;

font-size:9px;

text-indent:-9999px;

background:url(http://www5e.biglobe.ne.jp/~cep/a_6.gif) no-repeat left top;

}

.author {

clear:both;

border-top:1px dashed #c4d9d6;

color:#95b0ab;

text-align:right;

}

.forward {

color:#95b0ab;

text-align:right;

}

.article-footer {

background:#E3F9E0 no-repeat left bottom;

padding-bottom:14px;

color:#9dbc9f;

}

.article-footer a {

color:#9dbc9f;

}

ul.refer {

background:url() no-repeat left top;

padding-top:14px;

}

.back-to-top {

text-align:right;

padding:0 10px;

}

#blog-main .article-footer {

padding-bottom:8px;

}

#blog-main ul.refer {

padding-top:8px;

text-align:right;

}

.page span,.page a {

text-align:center;

line-height:15px;

width:15px;

height:15px;

float:left;

margin-right:2px;

display:inline;

}

.page span,.page a:hover {

color:#7298ab;

background:url() no-repeat left top;

}

#user-post {

color:#909b9e;

}

.user-post-title {

widht:100px;

height:14px;

font-size:0;

text-indent:-9999px;

margin:5px 0;

}

#trackback-title {

background:url(http://pic.pimg.tw/paula3844/4ae884812fd65.png) no-repeat left top;

}

#comment-title {

background:url(http://pic.pimg.tw/paula3844/4ae88476add5d.png) no-repeat left top;

}

.single-post {

margin-bottom:20px;

position:relative;

width:250px;

}

#comment-text .single-post {

padding-left:150px;

}

#comment-text .post-info {

width:200px;

overflow:hidden;

}

#comment-text .post-photo {

position:absolute;

top:5px;

left:0;

width:24px;

height:24px;

background:url() no-repeat left top;

padding:8px;

}

#comment-text .post-text {

width:200px;

overflow:hidden;

margin-left:100px;

padding:5px 0;

}

#comment-text .reply-text {

color:#9dbc9f;

width:300px;

overflow:hidden;

background:#e8f0ea;

padding:5px 100px;

}

#comment-text .reply-text p {

padding-top:5px;

}

#comment-text .secret {

    font-size: 12px;

    color: #9dbc9f;

    text-indent: 100px;

    background: #E3F9E0;

    height: 40px;

}

.post-comment {

height:1%;

overflow:hidden;

margin:20px 0;

}

.post-comment a {

float:right;

display:block;

width:150px;

height:18px;

background:url(http://pic.pimg.tw/paula3844/4aea25289ac25.png) no-repeat left top;

font-size:0;

text-indent:-9999px;

}

#trackback-url {

height:1%;

overflow:hidden;

background:url(http://pic.pimg.tw/paula3844/4ae884824ab2c.png) no-repeat left top;

margin:10px 0;

}

#trackback-url input {

float:left;

height:18px;

line-height:18px;

width:80px;

background:url() no-repeat left top;

margin-right:3px;

display:inline;

color:#7298ab;

}

input#trackback-input {

background:none;

width:230px;

height:18px;

line-height:18px;

overflow:hidden;

margin:0 13px 0 10px;

}

#trackback-text .post-info {

margin-left:30px;

}

#trackback-text .post-info span {

position:absolute;

top:0;

left:0;

width:25px;

height:25px;

text-align:center;

line-height:25px;

background:url() no-repeat left top;

color:#fff;

}

#trackback-text .post-text {

margin-left:30px;

margin-top:5px;

}

#comment-form {

width:300px;

margin:0 auto;

}

#comment-form th {

width:80px;

vertical-align:top;

}

#comment-form td {

width:220px;

padding:2px;

}

#comment-form input {

height:18px;

line-height:18px;

width:190px;

background:#d4eac7;

color:#7298ab;

padding:0 0 0 10px;

}

#comment-form textarea {

color:#7298ab;

width:180px;

height:80px;

line-height:18px;

background:#d4eac7;

padding:10px;

}

input#send-comment {

float:right;

font-size:0;

text-indent:-9999px;

display:block;

background:url() no-repeat left top;

width:40px;

height:18px;

padding:0;

}

#comment-form input.radio {

width:auto;

background:none;

margin-right:7px;

}

#comment-form label input {

width:160px;

}

#links {

opacity:.5;

-moz-opacity:.5;

filter:alpha(opacity=50);

-webkit-transition:all .5s ease-in-out;

-moz-transition:all .5s ease-in-out;

-o-transition:all .5s ease-in-out;

-ms-transition:all .5s ease-in-out;

width:265px;

float:right;

display:inline;

overflow:hidden;

background-color:#fff;

color:#9dbc9f;

margin:-50px 0 0 13px;

}

#links:hover {

opacity:1;

-moz-opacity:1;

filter:alpha(opacity=100);

-webkit-transition:all .5s ease-in-out;

-moz-transition:all .5s ease-in-out;

-o-transition:all .5s ease-in-out;

-ms-transition:all .5s ease-in-out;

width:265px;

float:right;

display:inline;

overflow:hidden;

background-color:#fff;

color:#9dbc9f;

margin:-50px 0 0 13px;

}

#links a {

-webkit-transition:all .5s ease-in-out;

-moz-transition:all .5s ease-in-out;

-o-transition:all .5s ease-in-out;

-ms-transition:all .5s ease-in-out;

color:#9dbc9f;

}

#links a:hover {

letter-spacing:6pt;

color:#95b0ab;

-webkit-transition:all .5s ease-in-out;

-moz-transition:all .5s ease-in-out;

-o-transition:all .5s ease-in-out;

-ms-transition:all .5s ease-in-out;

}

.box-title {

-webkit-transition:all .5s ease-in-out;

-moz-transition:all .5s ease-in-out;

-o-transition:all .5s ease-in-out;

-ms-transition:all .5s ease-in-out;

width:200px;

height:18px;

background:url() no-repeat left top;

color:#9dbc9f;

padding:0 10px;

}

.box-title:hover {

letter-spacing:6pt;

-webkit-transition:all .5s ease-in-out;

-moz-transition:all .5s ease-in-out;

-o-transition:all .5s ease-in-out;

-ms-transition:all .5s ease-in-out;

width:200px;

height:18px;

background:url() no-repeat left top;

color:#9dbc9f;

padding:0 10px;

}

.box-text {

padding:5px;

}

#footer {

clear:both;

color:#85a5b1;

}

#footer p {

margin:0 15px 0 175px;

}

#footer #bottom {

width:616px;

height:18px;

text-align:center;

font-size:0px;

padding-top:14px;

background:url(http://i.imgur.com/9nzSiyw.png) no-repeat center bottom;

}

#category-main .article-area-title {

padding-top:10px;

}

.main-list table th {

padding:2px 0;

}

.main-list table th.list-title {

padding:2px 5px;

}

.main-list table td {

line-height:15px;

height:15px;

vertical-align:center;

padding:0 5px 10px;

}

table td.list-date {

width:70px;

line-height:15px;

background:url(http://pic.pimg.tw/paula3844/4ae8b7f4f3ba3.png) no-repeat left top;

color:#b8a183;

font-family:century gothic;

font-size:9px;

vertical-align:top;

text-align:center;

padding:0 0 10px;

}

.list-title a img {

vertical-align:center;

}

#latest-comment li,#latest-trackback li,#subscription li {

border-bottom:1px solid #698fa2;

padding:2px 0;

}

#latest-comment li a,#latest-trackback li a,#subscription li a {

display:block;

}

#category h6 {

padding-left:15px;

background:url() no-repeat left 2px;

}

#category ul {

padding-bottom:3px;

}

#calendar td {

text-align:center;

vertical-align:center;

width:20px;

height:20px;

line-height:20px;

font-size:8px;

}

#calendar td a {

color:#739bb1;

display:block;

width:100%;

height:100%;

background:url() no-repeat 2px 2px;

}

#mylink h6 {

font-weight:bold;

}

#broadcast .box-text li {

border-bottom:1px solid #698fa2;

height:1%;

overflow:hidden;

}

#followed-murmurs * {

font-size:10px;

}

#broadcast #followed-murmurs .murmurs-photo img {

width:25px;

height:25px;

background:none;

border:none;

}

#broadcast #followed-murmurs .murmurs-functions {

background:none;

}

#search {

position:absolute;

top:46px;

left:13px;

width:150px;

margin:0;

padding:0;

}

#search li {

float:left;

display:inline;

}

#search input {

height:18px;

line-height:18px;

border:0;

font-size:10px;

font-family:verdana;

background:none;

color:#f6dfc0;

margin:0;

}

#search-target {

width:115px;

padding:0 10px;

}

#search-submit {

width:15px;

margin-top:1px;

font-size:0;

text-indent:-9999px;

display:block;

}

<script src=https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js ></script>

<script>

$(function() {

#container#links-row-1hsliceeachfunctionvaridname:$(this).attr(id);

idname:$idName.toLowerCase();

ifidnamematchmib-ad-sidebar:null){ $(this).remove();

}

Read more: http://xup6uu.pixnet.net/blog/post/263321485-%5b%e9%9b%bb%e8%85%a6%5d-2015%e5%b9%b4%e6%96%b0%e7%89%88pixnet%e9%81%a9%e7%94%a8%ef%bc%8f%e4%b8%80%e6%ac%a1%e7%a7%bb%e9%99%a4%28%e9%9a%b1%e8%97%8f%29%e9%83%a8#ixzz407tYY2yH

body {

background-image:url();

}

fieldset,img,abbr,acronym {

border:0;

}

ol,ul,li {

list-style:none;

}

input,textarea {

font-size:10px;

font-family:verdana;

border:0;

background:none;

}

#header a,#footer #bottom a {

color:#85a5b1;

}

#header a:hover,#footer #bottom a:hover {

color:#fff;

}

#banner .skiplink,.bookmark span,#comment-text a.delete-message img,#comment-text a.hide-message img,#comment-text a.show-message img,#trackback-text .post-info img,#comment-form h4,#category h6 img,#search .box-title,#content .recommended-posts,#pixblogad-banner2,#content .recommended-posts3,#pixblogad,);

</script>

#content .recommended-posts {

display:none;

}

#spotlight-text,.bookmark,#comment-form p {

padding:5px 0;

}

.article,.main-list table {

margin:20px 0;

}

.title,.article-footer ul,.article-footer h6 {

padding:0 10px;

}

.article-content,#visitor .box-more,#crumb .box-more {

clear:both;

}

.author a,.forward a {

color:#95b0ab;

}

.page,#visitor ul,#crumb ul,#search ul {

height:1%;

overflow:hidden;

}

.user-post-box,.box {

margin-bottom:20px;

}

#comment-text a.delete-message,#trackback-text .post-info a {

position:absolute;

top:0px;

left:260px;

width:12px;

height:12px;

display:block;

background:url() no-repeat left top;

}

#comment-text .post-photo img,#visitor li img,#crumb li img {

margin-top:20px;

width:24px;

height:24px;

}

.main-list table th.list-date,#calendar th {

text-align:center;

}

.list-visit,.list-comment {

vertical-align:top;

text-align:center;

}

#visitor li,#crumb li {

float:left;

display:inline;

padding:2px;

}

#blog468x60Banner,#container #links-row-1 div.hslice[id*=-mib-],#container #links-row-1 div.hslice[id*=-Mib-],#container #links-row-1 div.hslice[id*=-mIb-],#container #links-row-1 div.hslice[id*=-miB-],#container #links-row-1 div[class*=-mib-],#container #links-row-1 div[class*=-Mib-],#container #links-row-1 div[class*=-mIb-],#container #links-row-1 div[class*=-miB-] {

display:none!important;

}

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td,#search .box-text {

margin:0;

padding:0;

}

#link-album a:hover,#link-blog a:hover,#link-guestbook a:hover,#link-profile a:hover,a:hover#newpost,a:hover#backstage {

background:url() no-repeat left top;

}

#comment-text a.hide-message,#comment-text a.show-message {

position:absolute;

top:5px;

left:300px;

width:30px;

height:12px;

display:block;

background:url() no-repeat left top;

}

::selection,::-moz-selection {

background:#becdd5;

color:#FFF;

}

ol {

        margin-left:4em;

        list-style-type:square;

}