<meter>制作柱状图


<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>meter元素title>
head>
<body>
    <h3>2017上半年某公司销售额h3>
    <p>编程类图书:<meter min="0" max="100" low="30" height="80" value="85">meter>85万元p>
    <p>设计类图书:<meter min="0" max="100" low="30" height="80" value="65">meter>65万元p>
    <p>数据库类图书:<meter min="0" max="100" low="30" height="80" value="25">meter>25万元p>
    <p>幼儿教育:<meter min="0" max="100" low="30" height="80" value="15">meter>15万元p>
    <br/>
    <p style="color: red;font-weight: bold;">注意:IE浏览器不支持meter标记!p>
body>
html>

效果图
<meter>制作柱状图_第1张图片

你可能感兴趣的:(html5,html)