Appearance
HTML 基础
HTML/XML/XHTML · 元素分类 · 语义化 · property vs attribute · 本地存储 · 图片格式
一、HTML / XML / XHTML 区别
- HTML：语法较松散的 Web 标记语言
- XML：可扩展标记语言，用于存储数据和结构
- XHTML：基于 XML，语法更严格（标签小写、必须闭合、正确嵌套、必须有根元素）
- HTML5：HTML/XHTML/HTML DOM 的新标准，新增 canvas/video/audio/语义化标签/localStorage 等
二、行内元素、块级元素、空元素
- 行内元素：a、b、span、img、input、select、strong
- 块级元素：div、ul、li、dl、h1-h6、p
- 空元素：br、hr、img、link、meta（无闭合标签）
三、语义化标签
- 好处：去掉样式仍有清晰结构、利于 SEO、方便辅助设备解析、便于团队维护
- HTML5 新增：header、nav、footer、aside、article、section
四、property 与 attribute 区别
- attribute：HTML 标签上的特性（id、class 等），值为字符串
- property：DOM 对象的属性（JS 对象属性），如 childNodes、firstChild
五、HTML5 本地存储
- localStorage：永久存储，除非手动删除，可达 5M+
- sessionStorage：会话级别，关闭浏览器后销毁，不跨窗口共享
- 与 cookie 区别：
- cookie 每次 HTTP 请求都会携带，localStorage 不会
- cookie 大小限制 4K，localStorage 更大
- cookie 有过期时间，localStorage 永久
六、图片格式
- png：支持透明，颜色丰富，使用频率最高
- jpg/jpeg：不支持透明，可压缩，适合照片
- gif：支持动画，颜色较少