HTML自学笔记①——概述及基本文件结构

文章目录

  • HTML学习笔记——HTML概述
      • 1、网站和网页
          • 网站web site(文件夹)
          • 网页web page(文件)
            • 主页homepage
      • 2、标签
          • 标签的基本形式
          • 标签缩进
          • 标签属性
  • HTML学习笔记——文件结构
      • 1、HTML文件后缀
          • 基本文件结构
          • HTML5文件结构
      • 2、HTML属性
          • 标题
          • 段落 `

            `

          • 链接属性 `target=` 、`id=`、
          • 图像属性 `img=` 、`src=` 、`alt=` 、`width=` 、`height=`
  • WEB前端
          • 结构
          • 样式
          • 行为
          • 前端技术标准

HTML学习笔记——HTML概述

1、网站和网页


网站web site(文件夹)

互联网上用户展示特定内容的相关网页的集合

网页web page(文件)

网站中的一页,一个网站中的网页通过“超链接“的方式被组织在一起

主页homepage

网页元素:
站标Logo
导航栏
表单
文字超链接
banner广告横幅




2、标签


标签的基本形式
  • 由尖括号包围,Eg: </code></li> <li>通常是成对出现的:</li> <li>开始标签:<code><title></code></li> <li>结束标签:<code>
    百度一下
  • 也有单独出现的:

标签缩进

外层:父元素

内层:子元素


内层:子元素

​ 两个内层元素称为兄弟元素(同级)

文档
html
head
body
HTML DOM树
DOM:Document Object Model(文档对象模型)

标签属性

<img src="picture.jpg"alt=“站标” />


<标签名 属性①="值①"属性②=“值②” />







HTML学习笔记——文件结构


1、HTML文件后缀

.htm 或 .html


  • 基本文件结构

< !-- 内为注释内容 -->

<html>
    <head>
        <title>标题title>
    head>
    <body>
        Hello Html
    body>
html>   	

可通过Txt文本文档进行编写后将后缀改为.htm或.html 运行效果如图:
HTML自学笔记①——概述及基本文件结构_第1张图片



  • HTML5文件结构

<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title> title>
	head>
    <body>
        
    body>
html>
名 称 解 释
!DOCTYPE html 表示文档类型符合HTML5标准
lang:属性 搜索引擎:en英文,zh中文
meta 元数据
charset属性 编码方式(将字符和二进制码对应)
名 称 形 式
ASCALL 数字、英文字母、符号进行了编码
GB2312 简体中文
Unicode 所有语言
UTF-8 所有语言,占用空间更小
乱码 源文件编码方式与charset声明的编码方式不同

2、HTML属性

标题

一级标题

、二级标题

、三级标题


四级标题

、五级标题
、六级标题



段落

链接属性 target=id=

图像属性 img=src=alt=width=height=

WEB前端


结构

HTML : 从语义的角度,描述页面结构

样式

CSS : 从审美的角度,美化页面

行为

JavaScript : 从交互的角度,提升用户体验

前端技术标准

W3C标准 : www.w3.org
HTML5   CSS3   JavaScript

你可能感兴趣的:(HTML学习笔记,html)