HTML入门笔记1

71 阅读2分钟

起源:Tim Berners-Lee(李爵士)一手创办

最权威的网址:mdn 搜索时 关键词+mdn

Html 文档开头 <!DOCTYPE html>

声明文档类型,告诉浏览器我是html文档,请按照html文档格式解析我

基本结构:

<!DOCTYPE html> //文档类型
<html lang="en">  //lang = language 语言,可以用改成zh-CN
<head>
    <meta charset="UTF-8"> //字符编码
    <meta name="viewport" content="width=device-width,initial-scale=1.0">//禁用缩放,兼容手机 
    <meta http-equiv="X-UA-Compatible" content="ie=edge"> //兼容最新ie 
    <title>Document</title> //标题
</head>
<body>

</body>
</html>

常用章节标签:

h1,h2,h3,h4,h5,h6  //标题标签
section 章节
article 文章
main 主要内容
aside 其他内容
header 顶部内容
footer 底部内容
p 段落

全局属性:

class 设置标签的类名
contenteditable   content edit able(文本内容可编辑)
hidden 设置文件隐藏属性 true/false
id  名字属性,唯一 不建议使用因为无法保证唯一性
style   设置样式 能够将style放在body标签中,设置display属性将其可见,
        并contenteditable,就能在浏览器中实现页面实时更改,用处不大但是有点好玩
tabindex  始用tab键时,高亮部分的顺序 数值可设置
          负数 : tab键无法访问 0 : 最后访问 正数 : 按顺序从小到大依次访问
title 可将完整内容放在title中,鼠标悬停时能够显示全部内容

内容标签:

a  超链接标签,默认格式会有很丑的下划线以及点击过会变成紫色
em & strong em表示语气上的强调 strong表示内容本身的强调
pre html会将多个空格 tab 换行解析成一个空格(否则会占用空间)使用pre标签能够保留space tab enter
code 作用同md语言的单行注释'',通常和pre一起使用,保证代码美观
hr 分割线
br 换行
table 表格
ol>li 有序列表 ul>li 无序列表 dl>dt+dd 描述列表,前面为描述的对象,后面为描述的数据