html基础

MDN官方文档

MDN Web Docs

VScode

安装插件         Live Server           Auto Rename Tag

自动格式化        点击settings,然后输入format,然后勾选上Format On Save

html文件结构

文档结构
html的所有标签为树形结构,例如:




    
    
    Web应用课


    

第一讲

标签
HTML  元素 表示一个 HTML 文档的根(顶级元素),所以它也被称为根元素。所有其他元素必须是此元素的后代。

标签
HTML head 元素 规定文档相关的配置信息(元数据),包括文档的标题,引用的文档样式和脚本等。

标签
HTML body 元素表示文档的内容。document.body 属性提供了可以轻松访问文档的 body 元素的脚本。

标签
HTML <title> 元素 定义文档的标题,显示在浏览器的标题栏或标签页上。它只应该包含文本,若是包含有标签,则它包含的任何标签都将被忽略。

<meta>
HTML <meta> 元素表示那些不能由其它 HTML 元相关(meta-related)元素((<base>、<link>, <script>、<style> 或 <title>)之一表示的任何元数据信息。

常见属性:

charset:这个属性声明了文档的字符编码。如果使用了这个属性,其值必须是与 ASCII 大小写无关(ASCII case-insensitive)的”utf-8”。
name:name 和 content 属性可以一起使用,以名 - 值对的方式给文档提供元数据,其中 name 作为元数据的名称,content 作为元数据的值。
icon
<link rel="icon" href="images/icon.png">

<!-- 多行注释 -->
示例:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document


    


html基础_第1张图片

文本标签

文本标签虽然很多,但大部分可看成是预定好样式的

标签


元素 (或 HTML 文档分区元素) 是一个通用型的流内容容器,在不使用CSS的情况下,其对内容或布局没有任何影响。
其他块级标签例如:

,

,

, 
    ,
      , 。

      标签


      元素是短语内容的通用行内容器,并没有任何特殊语义。可以使用它来编组元素以达到某种样式意图(通过使用类或者 Id 属性),或者这些元素有着共同的属性,比如lang。应该在没有其他合适的语义元素时才使用它。

      元素很相似,但
      是一个 块元素 而 则是 行内元素
      其他内联标签例如:, , , ,
      ,

      -

      标签


      HTML

      标题 (Heading) 元素呈现了六个不同的级别的标题,

      级别最高,而

      级别最低。

      标签


      HTML

      元素(或者说 HTML 段落元素)表示文本的一个段落。该元素通常表现为一整块与相邻文本分离的文本,或以垂直的空白隔离或以首行缩进。另外,

      是块级元素。

      标签


      HTML

       元素表示预定义格式文本。在该元素中的文本通常按照原文件中的编排,以等宽字体的形式展现出来,文本中的空白符(比如空格和换行符)都会显示出来。(紧跟在 
       开始标签后的换行符也会被省略)


      标签


      HTML
      元素在文本中生成一个换行(回车)符号。此元素在写诗和地址时很有用,这些地方的换行都非常重要。


      标签


      HTML


      元素表示段落级元素之间的主题转换(例如,一个故事中的场景的改变,或一个章节的主题的改变)。

      在 HTML 的早期版本中,它是一个水平线。现在它仍能在可视化浏览器中表现为水平线,但目前被定义为语义上的,而不是表现层面上。所以如果想画一条横线,请使用适当的 css 样式来修饰。

      标签


      HTML 元素 用于表现因某些原因需要区分普通文本的一系列文本。例如技术术语、外文短语或是小说中人物的思想活动等,它的内容通常以斜体显示。

      标签


      HTML 提醒注意(Bring Attention To)元素()用于吸引读者的注意到该元素的内容上(如果没有另加特别强调)。这个元素过去被认为是粗体(Boldface)元素,并且大多数浏览器仍然将文字显示为粗体。尽管如此,你不应将 元素用于显示粗体文字;替代方案是使用 CSS font-weight 属性来创建粗体文字。

      标签


      HTML 的标签表示一些被从文档中删除的文字内容。比如可以在需要显示修改记录或者源代码差异的情况使用这个标签。标签的作用恰恰于此相反:表示文档中添加的内容。

      标签


      HTML 元素定义已经被插入文档中的文本。

       图片

      HTML 元素将一份图像嵌入文档。
      默认为行内元素,即display: inline。

      src属性


      该属性是必须的,它包含了你想嵌入的图片的文件路径。

      alt属性


      该属性包含一条对图像的文本描述,这不是强制性的,但对可访问性而言,它难以置信地有用——屏幕阅读器会将这些描述读给需要使用阅读器的使用者听,让他们知道图像的含义。如果由于某种原因无法加载图像,普通浏览器也会在页面上显示alt 属性中的备用文本:例如,网络错误、内容被屏蔽或链接过期时。

      height属性


      图像的高度,在 HTML5 中的单位是 CSS 像素,在 HTML 4 中既可以是像素,也可以是百分比。可以只指定 width 和 height 中的一个值,浏览器会根据原始图像进行缩放。

      width属性


      图像的宽度,在 HTML5 中单位是 CSS 像素, 在 HTML 4 中可以是像素也可以是百分比。

      音频和视频 


      HTML

      使用src属性播放
      示例:

      资源
      mp3
      sound1
      sound2

      示例:

       表单

      标签


      HTML 元素表示文档中的一个区域,此区域包含交互控件,用于向 Web 服务器提交信息。

      标签


      HTML 用来填写内容,常见类型有:

      :创建基础的单行文本框。
      :用于让用户输入一个数字。其包括内置验证以拒绝非数字输入。浏览器可能会选择提供步进箭头,让用户可以使用鼠标增加和减少输入的值,或者只需用指尖敲击即可。
      :带有 “email” (电子邮箱) 类型标记的输入框元素 () 能够让用户输入或编辑一个电子邮箱地址,此外,如果指定了multiple属性,用户还可以输入多个电子邮箱地址。在表单提交前,输入框会自动验证输入值是否是一个或多个合法的电子邮箱地址 (非空值且符合电子邮箱地址格式). CSS 伪标签 :valid 和 :invalid 能够在校验后自动应用。
      元素 里有一种叫做 “password” 的值,给我们一个方法让用户更加安全的输入密码。这个元素是作为一行纯文本编辑器控件呈现的,其中文本被遮蔽以致于无法读取,通常通过用诸如星号(“*”)或点(“•”)等符号替换每个字符来实现。这个符号会根据用户的浏览器和操作系统来具体显示哪个。
      的 radio 类型元素默认渲染为小型圆圈图表,填充即为激活,类似于之前描述额复选框(checkbox)类型。单选按钮允许你选择单一的值来提交表单。
      常用属性有:

      name: 名称
      id: 唯一ID
      maxlength:最大长度
      minlength:最小长度
      required:是否必填
      placeholder:当表单控件为空时,控件中显示的内容



      无序列表

      • first item
      • second item
      • third item

      有序列表

      1. 发疯
        1. 啊啊啊
        2. 不得鸟
        3. future
        4. 学习
      2. Fi
      3. Fo
      4. Fum
      Name
      Godzilla
      Born
      1952
      Birthplace
      Japan
      Color
      Green
      Orange

      你可能感兴趣的:(web,web,html)