CSS3是一種很酷炫的技術，可以展示非?？犰诺臄祿?。下面我們來看一下CSS3酷炫的數據展示。

.chart {
width: 100%;
height: 300px;
background-color: #F2F2F2;
position: relative;
}
.chart:before {
content: "";
display: block;
width: 50%;
height: 100%;
background-color: #333;
position: absolute;
left: 0;
top: 0;
transform: skew(-15deg);
transform-origin: right;
}
.chart:after {
content: "";
display: block;
width: 50%;
height: 100%;
background-color: #333;
position: absolute;
right: 0;
top: 0;
transform: skew(15deg);
transform-origin: left;
}
.chart .bar {
width: 20px;
height: 0;
background-color: #FF9800;
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
transition: height 1s ease;
}
.chart .bar:nth-child(1) {
height: 40%;
}
.chart .bar:nth-child(2) {
height: 50%;
}
.chart .bar:nth-child(3) {
height: 60%;
}
.chart .bar:nth-child(4) {
height: 70%;
}
.chart:hover .bar:nth-child(1) {
height: 80%;
}
.chart:hover .bar:nth-child(2) {
height: 70%;
}
.chart:hover .bar:nth-child(3) {
height: 60%;
}
.chart:hover .bar:nth-child(4) {
height: 50%;
}

以上代碼將會生成一個酷炫的數據展示的圖表，鼠標懸停在圖表上方時可以觀察到一些特別的效果。這展示了CSS3的強大功能。