HTML入门笔记1

will80
145 阅读2分钟

关于HTML

WWW——URL+HTTP+HTML
WWW之父——Sir Timothy John Berners-Lee （蒂莫西·约翰·伯纳斯-李爵士）
HTML——HyperText Markup Language，中文是超文本标记语言
W3C——World Wide Web Consortium，中文是万维网联盟

HTML的起手式

  <!DOCTYPE html>   # 告诉浏览器文档类型是 html
  <html lang="en">   # 浏览器页面的语言是en英语，可以改为 zh-CN，网页的语言就是中文。在浏览器的翻译功能中，就是依赖该字段去翻译。
<head>
  <meta charset="utf-8">   # 告诉浏览器文件的字符编码是 UTF-8
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />   # 禁用缩放，兼容手机
  <meta http-equiv="X-UA-Compatible" content="ie=edge" />   # 告诉 IE 浏览器使用最新的内核
  <title>JS Bin</title>   # 该页面的标题为 Document,用户可修改
</head>
<body>
</body>
</html>
</pre>

常用的表标签

标签名 描述 备注
h1-h6 标题 h1的标题字体最大，h6的标题字体最小
section 章节 定义文档中的一个章节
article 文章 定义可以独立于内容其余部分的完整独立内容块
p 段落 定义一个段落
header 头部 定义页面或章节的头部，常用来包含 logo、页面标题和导航栏
footer 脚部 定义页面或章节的尾部，常用来包含版权信息、使用条款和反馈建议等链接
main 主要内容 定义文档中主要或重要的内容
aside 次要内容 定义和页面内容关联度较低的内容。常显示在页面的左侧或右侧
div 划分 代表一个通用的容器，没有特殊含义

全局属性

属性名 描述
class 定义元素的类名
contenteditable 使得定义元素的内容可编辑
hidden 把元素隐藏
id 定义元素的唯一，但是比起class，会有众多的bug，建议少用
style 定义元素的行内样式，比css样式的优先级高，但可被css样式覆盖。
tabindex 定义元素被tab键选中的次序
title 定义关于元素的额外信息

常用的内容标签

  • ol+li:有序列表 ordered list + list item
  • ul+li:无序列表 unordered list + list item
  • dl+dt+dd:描述列表（discription list）+描述项目（discription term）+描述数据（discription data）
  • pre:按预定格式显示的文本（Preformatted），可规避空白折叠现象
  • code:代码格式，其中字体格式为等宽
  • hr:横线，比如本文中个标题下面的横线
  • br:换行
  • a:插入超链接
  • em:语气上的强调，默认斜体
  • strong:内容上的强调，默认粗体
  • q:即是quote，引用
  • blockquote:上面的q的变形，换行用
avatar
文章
阅读
粉丝