前端html基础 | 青训营笔记

56 阅读2分钟

这是我参与「第五届青训营 」伴学笔记创作活动的第 1 天

html常用标签:

doctype:

<!DOCTYPE html> 标记当前页面使用的html版本,浏览器根据这个标签选择渲染页面的方式

html:

<html lang="en"> 根标签 lang表示语言

head:

<head></head> 存放页面元数据,如页面标题,声明页面使用的编码格式等

body:

<body></body>存放页面内容

标题标签:

<h1~6></h1~6>

列表标签:

有序列表:

<ol><li></li></ol>(1,2,3,4)

无序列表:

<ul><li></li></ul>(小黑点)

key-value列表:

<dl><dt></dt><dd></dd></dl>

超链接标签:

<a href="#"></a>引用地址后,点击后跳转到相应的地址 href,跳转的链接地址

多媒体标签:

  • <img src="#" alt="">(图片标签)
    
  • <audio src="#"></audio>(音频标签)
    
  • <video src="#"></video>(视频标签)
    

input:

<input type="text">文本输入框,用户输入信息,可以指定输入类型(checkbox,range,number,date等)

文本类标签:

blockquote:

<blockquote></blockquote>块级引用(常用来引用某段话)

cite:

<cite></cite>短引用(常用来应用某个词或标题)

q:

<q></q>引用内容

code:

<code></code>引用代码,多行引用时可以使用pre标签将code标签包裹起来

strong、em:

<strong></strong> 、 <em></em>表示强调

语法:

  •  标签,属性不区分大小写
    
  •  空标签可以不闭合,如input,meta
    
  •  属性值推荐使用双引号包裹
    
  •  某些属性值可以省略,如 required、readonly
    

代码规范:

语义化,如有序列表使用ol,无序列表使用li

前端是利用web技术栈解决多端图形用户界面交互问题,浏览通过将html代码,解析成dom树后,再将其渲染在浏览器页面显示图形化结果,html体现的是页面的结构和内容而css则是页面的样式,页面经过css的修改后更加美观和贴近人们的习惯,JavaScript则是控制页面的行为,让页面具有各种各样的功能,满足人们各种不同的需求场景