博客列表 >HTML 前端基础 文档与属性

HTML 前端基础 文档与属性

云猫
云猫原创
2020年04月15日 16:32:22512浏览

HTML基础

1.网页的组成

序号 内容 描述
1 文本 可以看到的文字内容
2 资源 如视频、图片、音频等等
3 标记 对文本或资源的描述

网页是由上面的三个部分组成,案例代码如下:

  1. <p>我在学习HTML基础知识</p>
  2. <img src="logo.png" alt="logo" />

2.HTML的设计思想

  • HTML中的一切,都是基于标签来实现的
  • 标签也就是标记,用于对各类文档内容描述和分类
  • HTML不是编程语言
  • 超文本:是含有超链接的文本
  • 预定义标记:是用来描述内容的固定标签

3.HTML的页面结构

序号 代码 解释
1 <!DOCTYPE html> 通知浏览器我是html文档
2 <html>…</html> 根元素,也叫根标签,页面所有代码都写在这对标签中
3 <head>…</head> 头部信息,用户看不到的,用户写页面标题,描述字符编码等等
4 <body>…</body> 用户可看区域,页面的主体内容
5 <meta charset="UTF-8"> 告诉浏览器,当前编码是UTF-8,写在head标签中
6 <meta name="viewport" content="width=device-width, initial-scale=1.0" /> name=”viewport” 表示视口,也就是如何显示这个页面;content=”width=device-width 表示网页宽度等于设备宽度;initial-scale=1.0 表示缩放比例,1.0是原始比例,不可对页面进行缩放;常用于手机端显示,该代码写在head标签中
7 <title>…</title> 设置网页标题,该代码写在head标签中

4.元素的属性和值

4.1 元素

  • 元素分为 “非空元素” 和 “空元素” 两种;
  • 非空元素:双标签
  • 空元素:单标签

    4.2 属性和值

  • 属性:即对标签/元素进行设置
  • 值:即属性的值
  • 对一个P标签设置name属性,name属性的值为demo;示例代码如下
    1. <p name="demo">我是一个元素标签</p>

5.网页中的特殊字符

  • 网页中的特殊字符需转义后才能在html中使用,下方是一些常用的转义字符
显示 描述 实体名称 实体编号
空格
< 小于 < <
> 大于 > >
& &符号 & &
双引号
© 版权 © ©
® 已注册商标 ® ®
商标(美国)
× 乘号 × ×
÷ 除号 ÷ ÷

手写作业:

声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议