HTML5 笔记1— details元素、mark元素、progress元素、meter元素

    xiaoxiao2021-03-25  110

    基本只有google支持

    1.detail元素有<summary>

    未点击前:

    点击三角形展开内容:

    <body> <details> <summary>HTML5+CSS3</summary> <p>标准通用标记语言下的一个应用HTML标准自199912月发布的HTML4.01后...</p> </details> </body>

    2detail元素没有<summary>

    点击前:

    点击后:

    <body> <details> <p>标准通用标记语言下的一个应用HTML标准自199912月发布的HTML4.01后...</p> </details> </body>

    3.mark元素

    mark元素用于高亮显示、突出显示的,主要目的吸引读者注意。

    <body> <h2>以下是关于<mark>html5</mark>的简介</h2> <p><mark>HTML5</mark>赋予网页更好的意义和结构。更加丰富的标签将随着对RDFa的,微数据与微格式等方面的支持,构建对程序、对用户都更有价值的数据驱动的Web。</p> </body>

    4.progress元素

    <body> <p> 当前任务完成进度: <progress value="85" max="100">85%</progress> </p> </body>

    5.meter元素

    optimum的值小于low值时显示绿色,大于high值时显示红色;low和high之间是黄色。 <p> 硬盘使用情况:<meter value="43" max="120" min="0">43/120</meter>GB </p> <p> 硬盘使用情况:<meter value="43" max="120" min="0" low="50" high="90" optimum="43">43/120</meter>GB </p>
    转载请注明原文地址: https://ju.6miu.com/read-19961.html

    最新回复(0)