mysql的着重号_HTML5 更好的列表项着重号

CSS

语言：

CSSSCSS

确定

.live {

overflow: hidden;

}

.live > li {

list-style: none;

position: relative;

padding: 0 0 0 2em;

margin: 0 0 0.5em 10px;

-webkit-transition: 0.12s;

transition: 0.12s;

}

.live > li::before {

position: absolute;

content: '\2022';

font-family: Arial;

color: #fff;

top: 0;

left: 0;

text-align: center;

font-size: 2em;

opacity: 0.5;

line-height: 0.75;

-webkit-transition: 0.5s;

transition: 0.5s;

}

.live > li:hover {

color: #fff;

}

.live > li:hover::before {

-webkit-transform: scale(2);

-ms-transform: scale(2);

transform: scale(2);

opacity: 1;

text-shadow: 0 0 4px;

-webkit-transition: 0.1s;

transition: 0.1s;

}

.live.type2 > li::before {

content: '';

width: 10px;

height: 10px;

background: #fff;

border-radius: 3px;

line-height: 0;

top: 0.27em;

left: 5px;

}

.live.type2 > li:hover::before {

-webkit-transform: none;

-ms-transform: none;

transform: none;

border-radius: 5px;

width: 25px;

left: -10px;

background: #ba5353;

}

.live.numbers {

counter-reset: xxx 0;

}

.live.numbers > li::before {

content: counter(xxx, decimal) ".";

counter-increment: xxx 1;

font-family: 'Roboto Condensed';

font-size: 1em;

opacity: 0.5;

line-height: 1.4;

-webkit-transition: 0.5s;

transition: 0.5s;

}

.live.numbers > li:hover:before {

opacity: 1;

left: -10px;

-webkit-transform: none;

-ms-transform: none;

transform: none;

text-shadow: none;

-webkit-transition: 0.12s;

transition: 0.12s;

}

@font-face {

font-family: 'Roboto Condensed';

font-style: normal;

font-weight: 400;

src: local("Roboto Condensed Regular"), local("RobotoCondensed-Regular"), url(http://themes.googleusercontent.com/static/fonts/robotocondensed/v7/Zd2E9abXLFGSr9G3YK2MsFzqCfRpIA3W6ypxnPISCPA.woff) format("woff");

}

html {

height: 100%;

}

body {

height: 100%;

font: 1.5em 'Roboto Condensed', arial;

color: #fff;

text-align: center;

background-image: -webkit-radial-gradient(circle, #3c3b52 0%, #252233 80%);

background-image: radial-gradient(circle, #3c3b52 0%, #252233 80%);

}

h1 {

margin: 0.5em 0 0;

padding: 0;

text-shadow: 0 4px rgba(0, 0, 0, 0.2);

}

* {

-moz-box-sizing: padding-box;

box-sizing: padding-box;

}

ol,

ul {

width: 28%;

display: inline-block;

text-align: left;

vertical-align: top;

background: rgba(0, 0, 0, 0.2);

color: rgba(255, 255, 255, 0.5);

border-radius: 5px;

padding: 1.5em;

margin: 2%;

box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);

}