html5圆环图比例教程,Chart.js 使用实例 - 圆环比例图表
CSS
语言：
CSSSCSS
确定
@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,400italic,600,600italic,700,700italic,800,800italic|Roboto+Condensed:400,300,300italic,400italic,700,700italic|Montserrat:400,700|Roboto:400,100,100italic,300,300italic,400italic,500,500italic,700,700italic,900,900italic|Titillium+Web:400,200,200italic,300,300italic,400italic,600,600italic,700,700italic,900|Open+Sans+Condensed:300,300italic,700');
#fundivo-hlwn-when-chart {
overflow: hidden;
max-width: 600px;
padding: 20px;
margin: auto;
font-family: 'Roboto condensed', sans-serif;
}
.wrapper div {
min-height: 200px;
}
#hlwn-when {
float: left;
margin-right: 20px;
width: 60%;
}
#hlwn-when-chart-legend {
overflow: hidden;
min-height: 170px;
}
.hlwn-when-chart-legend {
margin-left: 0px;
}
.hlwn-when-chart-legend ul {
list-style-type: none !important;
padding: 0;
margin: 0;
}
.hlwn-when-chart-legend li {
height: 2em;
}
.hlwn-when-chart-legend li span {
display: inline-block;
vertical-align: middle;
width: 18px;
height: 18px;
margin: 5px;
border-radius: 3px;
}
@media screen and (max-width: 480px) {
#hlwn-when {
float: none;
margin-right: 0;
width: auto;
border: 0;
}
#hlwn-when-legend {
margin-top: 10px;
}
}