概述
details元素与summary元素
details语义：详情
summary语义：概要，摘要
details元素可以实现类似显示/隐藏的功能，summary用于显示details的标题或者间接
注意：（1）如果details下面没有summary元素，浏览器会自动添加，同时内容是“详细信息”。 （2）details默认是关闭状态的，我们可以通过设置open属性让他打开。
（3）我们也可以通过JS获取details是否打开的状态。
<details id="hebiIntroduce" open>
<summary>鹤壁简介</summary>
<p>鹤壁是封神榜故事发生地，中国商朝首都朝歌、周朝第一大诸侯国卫国首都朝歌、战国七雄赵国首都中牟均位于鹤壁市。境内浚县城是国家历史文化名城。林、石、卫、康、殷姓及韩国（朝鲜）康氏、琴氏等姓氏均起源于此，鹤壁是中华民族姓氏的重要发祥地。
</p>
</details>
<button οnclick="getDetailsStatus()">获取状态</button>
</body>
<script>
function getDetailsStatus(){
var details = document.getElementById("hebiIntroduce");
var status = details.open;
alert(status)
}
</script>
mark元素
mark语义：标记，做记号。
mark元素的作用是为了突出显示页面的某一块内容。
特点：放在mark元素内部的内容，将高亮显示（背景颜色为黄色）。
5.3 small元素
small语义：小字体文本
特点：字体比普通字体小一点。
一般用法：用于放一些希望被忽略的内容。免责声明、注意事项
<h3>鹤壁简介</h3>
<p>鹤壁是<mark>封神榜</mark>故事发生地，中国商朝首都朝歌、周朝第一大诸侯国卫国首都朝歌、战国七雄赵国首都中牟均位于鹤壁市。境内浚县城是国家历史文化名城。林、石、卫、康、殷姓及韩国（朝鲜）康氏、琴氏等姓氏均起源于此，鹤壁是中华民族姓氏的重要发祥地。<small>这些朝代都灭亡了</small>
商场大打折 5.5折<small>起</small>
</p>
ol
ol列表 添加了start和reversed属性
start：定义开始计数的系数。
reversed：计数的顺序，默认是从小到大，加上该属性之后从大到小。
progress
语义：进度、完成的进度
progress是行内标签，有两个常用属性：max：进度的最大值；values：当前进度的值。
注意：看到的进度效果是value/max的比例。
meter
meter语义：度量衡
注意：一般情况：需要已知最大值和最小值，
cite
cite:引用，出自。
用法：一般用于定义作品（书籍、电影、歌曲、电视节目、绘画）
注意：使用了该元素，内容变成斜体。
最后
以上就是犹豫帽子为你收集整理的H5的页面元素details元素与summary元素 mark元素 olprogressmetercite的全部内容，希望文章能够帮你解决H5的页面元素details元素与summary元素 mark元素 olprogressmetercite所遇到的程序开发问题。
如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。
发表评论 取消回复