HTML入门笔记1

FENG
154 阅读2分钟

一、HTML概述

  1. HTML 是谁发明的：Tim Berners-Lee 李爵士
  2. WWW（万维网）=URL+HTTP+HTML
  3. 搜索HTML权威资料网站：Google 搜索 MDN HTML5（MND纠错更新及时）
  4. 查询HTML是否正确：看VScode/WebStorm的颜色提示，或者在google 搜索w3c.validator，在Validate by Direct Input页面复制查询

二、HTML标签

  1. HTML 起手应该写什么：“！”；html标签需要吧lang="en"修改为lang="zh-CN"，<title> <title>中间写标题
  2. 常用的表示章节的标签有哪些，分别是什么意思 -h1~h6表示标题，字体大小从h1到h6递减
  • section 表示开启新的章节
  • p表示段落
  • header 置顶，顶部
  • footer 底部
  • &copy;版权标志
  • main 主要内容
  • aside 旁支内容（参考资料、导航等）
  • div 划分，表示div内的内容是一个整体
  1. 全局属性有哪些（所有标签都有的属性）
  • class 给标签分类，标记，样式
  • contenteditable 可使任何一个元素直接被编辑
  • hidden 可以让任何元素看不见
  • id 一般建议使用class，不到万不得已不用id，因为id不报错 会误导；在JS可以直接调用（也不建议使用，Windows已有的全局属性不能设置为id）
  • style 属性，如果放到body内可显示、编辑，style 优先级比class高
  • tabindex 控制tab顺序，tabindex=正数 按顺序访问； tabindex=0最后一个访问； tabindex=-1 不访问
  • title

不换行不出页面 小技巧

  • white-space=nowrap;不换行
  • text-overflow=ellipsis;文字出去就出现省略号
  • overflow:hidden;省略部分用省略号表示
  • title="完整的内容" 鼠标浮上后显示完整内容
  1. 查看HTML默认样式：开发者工具Elements-stlye-user agent stylesheet，可通过CSS覆盖
  • table标签修改建议：
table{
  border-collapse: collapse;
  border-spacing: 0;
}
  1. 常用的内容标签有哪些，分别是什么意思
  • ol+li 有顺序的列表及内容
  • ul+li 没有顺序的列表及内容
  • dl+dt+dd 描述列表，dt表示描述对象，dd表示描述内容
  • pre 保留标签内的空格、回车、tab；HTML默认合并多个连续空格/回车/tab为一个
  • hr 分割线
  • br 换行
  • a 一般用于超链接
  • em 表示强调 语气重要
  • strong 表示重要 本身重要
  • code 标签内的字体是等宽的，可以和pre标签结合使用
  • quote表示引用，行内引用
  • blockquote表示引用，换行引用
avatar
文章
阅读
粉丝