You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<!-- 文档类型声明, 表明这是遵循HTML 4.01 Transitional规范的HTML文档, 并且指定了对应的DTD( 文档类型定义) 文件的位置 -->
< html >
< head >
<!-- 页面标题,目前为空,可根据实际需求设置具体显示的标题内容 -->
< title > < / title >
<!-- 设置页面的内容类型为text/html, 字符编码为utf - 8, 确保能正确解析和显示各种字符 -->
< meta http-equiv = "Content-Type" content = "text/html;charset=utf-8" / >
<!-- 引入外部的JavaScript文件, 路径为相对路径的../internal.js, 通常这里面包含了页面所需的一些通用的脚本逻辑 -->
< script type = "text/javascript" src = "../internal.js" > < / script >
< style type = "text/css" >
/* 对html和body元素设置样式, 使其超出部分隐藏, 防止出现滚动条等情况, 一般用于页面布局控制, 让页面整体显示更规整 */
html , body {
overflow : hidden ;
}
/* 设置id为specharsTab的元素的样式, 宽度占父元素的97%, 上下外边距为10px且水平居中, zoom:1用于解决IE浏览器下的一些兼容问题, position: relative表示相对定位, 方便内部元素基于它进行定位等操作 */
# specharsTab {
width : 97 % ;
margin : 10 px auto ;
zoom : 1 ;
position : relative
}
/* 设置类名为tabbody的元素的样式, 高度为447px, 用于控制这类元素在页面中的高度呈现 */
. tabbody {
height : 447 px ;
}
/* 设置类名为tabbody下的span元素的样式, 上下外边距为5px, 左右外边距为3px, 文本水平居中, 将其显示为行内块元素( 既有行内元素特点又能设置宽高等块级元素特性) , 宽度为40px, 高度为16px, 行高为16px以让文本垂直居中, 并且鼠标悬停时变为手型指针, 表示可交互 */
. tabbody span {
margin : 5 px 3 px ;
text-align : center ;
display : inline-block ;
width : 40 px ;
height : 16 px ;
line-height : 16 px ;
cursor : pointer ;
}
< / style >
< / head >
< body >
<!-- 创建一个id为specharsTab的div元素, 作为页面中的一个主要容器, 后续相关内容会放置在它内部 -->
< div id = "specharsTab" >
<!-- 创建两个div元素, 分别设置了不同的id和类名, id为tabHeads的元素应用了tabhead类, 可能用于页面中某个选项卡头部相关内容的布局; id为tabBodys的元素应用了tabbody类, 结合前面的样式定义, 可能用于选项卡主体内容的布局等 -->
< div id = "tabHeads" class = "tabhead" > < / div > < div id = "tabBodys" class = "tabbody" > < / div >
< / div >
<!-- 引入外部的JavaScript文件spechars.js, 通常这里面包含了和当前页面特定功能相关的脚本代码, 比如操作上述选项卡等交互逻辑 -->
< script type = "text/javascript" src = "spechars.js" > < / script >
< / body >
< / html >