二 HTML文档基本结构
2.1 HTML5文档结构:
- HTML5文档结构包括头部(head)、主体(body)两大部分。
2.1.1<!DOCTYPE>声明
引用官方的DTD文件,在HTML5之前版本,如xHTML、HTML4.0都有官方的DTD文件引用,DTD是文件类型定义,主要对标签的使用进行定义。基于HTML5“化繁为简”准则,不需要引用严格意义上的DTD规范,只需引用<!DOCTYPE html>代码即可。
2.1.2 <html>标签
html文档的根元素,成对出现,代表文档的开始和结束。
2.1.3 <head>标签
<head></head> 文档的头部标签,为所有头部元素的容器,<head>中元素可以引用脚本、指示浏览器在哪里找到样式表,提供元信息等
<title></title> 用于定义文档标题,只能出现在<head>中
<meta> 用于定义html元数据
<link rel="stylesheet" href=""> 引用外部文件标签,通常放置在头部标签<head>中,用于连接外部CSS资源文件
<style></style> 为内嵌样式标签,位于<head>中,用于定义内部CSS样式
2.1.4<meta>标签
设置页面关键字——用于告诉搜索引擎网页的关键字
<meta name="keyword" content="某人,论坛,学历,前端">
用于告诉搜索引擎网站的主要内容
<meta name="description" content="web前端的一些面试技巧">
用于介绍作者的一些信息
<meta name="author" content="某人,邮箱">
设置网页的定时跳转
<meta http-equiv="Refresh" content="";URL=""> /*content后跟值为当前页面在多少时间跳转,URL值为跳转到具体的网页网站*/
2.1.5 <body>标签
body标签是HTML的主体部分,网页所需显示内容都放在该标签内。
2.2 HTML5标签、元素及属性
HTML网页实际由许许多多各种各样的HTML元素构成的文本文件,并且任何网页浏览器都可以直接运行HTML文件。
HTML元素就是通过HTML标签进行定义的。
2.2.1标签
1.单标签
<br> 换行
<hr> 创建一条水平线
<meta> 元素可提供有关页面的元信息
<img src="" alt=""> 图片标签,用于页面插入图片
2.双标签
<h1></h1> 标题标签
<p></p> 段落标签
<ul></ul> 无序列表标签
<table></table>表格标签
3.
- 标题标签:<h1>-<h6>,<h1>标签代表1级标题,级别最高,文字最大其他标签依次递减;
标题字对齐属性:align
center: 居中对齐;
left: 左对齐内容;
right: 右对齐内容;
justify: 对行进行伸展,每行都可有相同长度
- 段落标签:<p>
- 换行标签:<br> 将文字在一个段内强制换行,一个<br>代表换行一次
- 不换行标签:<nobr> 不换行内容放在<nobr><nobr/>之间;<nobr><nobr/>之间遇到<br>换行标签,内容将自动换行;
- 水平线标签:<hr> 将上下内容分隔开
- 插入空格:
- 插入特殊字符:“&”开头,“;”结尾,中间加上特殊字符对应编码即可,特殊字符对应编码链接: https://www.jb51.net/onlineread/htmlchar.htm
2.2.2 标签属性
- <标签名 属性名1=“属性值1” 属性名2=“属性值2” ……>内容部分</标签名> 两个不同的属性之间不需要分号
- <p style="color:red;font-size:20px;background-color:white"> style属性中的不同设置需要分号
2.2.3 元素
<p>HTML</p> 开始标签到结束标签所有代码,为HTML元素
位于起始标签和结束标签之间的文本为HTML元素内容
二 HTML文档基本结构的更多相关文章
- HTML介绍、文档基本结构、meta标签、HTML标记的语法
一.HTML的介绍 Hyper Text Mark-up Language 超文本标记语言,是一种描述性标记语言(不是编程语言),主要用于描述网页(可以有图像,文字,声音,等..)但没有交互性 HTM ...
- 深入分析MFC文档视图结构(项目实践)
k_eckel:http://www.mscenter.edu.cn/blog/k_eckel 文档视图结构(Document/View Architecture)是MFC的精髓,也是Observer ...
- MFC单文档程序结构
MFC单文档程序结构三方面: Doc MainFrame View
- MFC 构建、消亡 顺序 (二)--多文档 (MDI)
MFC 构建.消亡 顺序 (二)--多文档 (MDI) by:http://www.cnblogs.com/vranger/ (一)MDI 生成顺序 (二)打开文档-“Open” (三)新建文档-“N ...
- MFC文档视图结构学习笔记
文档/视图概述 为了统一和简化数据处理方法,Microsoft公司在MFC中提出了文档/视图结构的概念,其产品Word就是典型的文档/视图结构应用程序 MFC通过其文档类和视图类提供了大量有关数据处理 ...
- 使用ABBYY FineReader 手动校正文档复杂结构
ABBYY FineReader 15(Windows系统)拥有强大的OCR识别功能,能对扫描仪或者数码相机等光学工具获取的图像进行识别,解析其中的文本.图像.表格.条形码等,方便用户进一步获取图像中 ...
- XML 文档的结构
XML 文档的组成 一个XML文档由两部分构成:第一部分是文档序言,第二部分是文档元素(节点). 1.文档序言 文档序言通常位于XML文档的顶端,根元素之前出现,它是一个特定的包含XML 文档设定信息 ...
- .Net Core3.0 WebApi 项目框架搭建 二:API 文档神器 Swagger
.Net Core3.0 WebApi 项目框架搭建:目录 为什么使用Swagger 随着互联网技术的发展,现在的网站架构基本都由原来的后端渲染,变成了:前端渲染.后端分离的形态,而且前端技术和后端技 ...
- MongoDB_文档存储结构(三)
MongoDB 文档数据库的存储结构分为四个层次,从大到小依次是:数据库(database).集合(collection).文档(document).键值对. 图 1 描述了 MongoDB 与 My ...
随机推荐
- mongodb 数据操作CRUD
链接到mongo 新建超级用户 上文中我们提到mongo用户库表管理.为了方便我们先新建一个root权限的用户. db.createUser({user:'dbadmin',pwd:'123456', ...
- 使用WxPusher给自己的个人微信发送提醒消息(WxPusher微信推送服务)
1.背景 我们很多时候,我们在服务器上运行软件,发生一些业务异常,需要给我们发送一个及时的提醒,或者是使用一些耗时软件,比如抢车票,抢课,刷优惠券当任务运行成功以后,也需要及时的发送消息给自己 ,告诉 ...
- Stream(二)
public class Test { /* * Stream接口: * 实现类 * IntStream * DoubleStream * LongStream * * 一.创建Stream * 1. ...
- Linux系统Yum仓库制作
在使用Linux系统的时候,通常需要安装许多软件,Linux系统通常安装软件有源码包安装(文件格式:.tar.gz 或.tar.bz2:安装过程:解压.环境检查.编译和安装).Rpm包安装(文件格式: ...
- LeakCanary检测内存泄漏
内存泄漏原因: 线程造成的内存泄漏 Handler造成的内存泄漏 单例导致内存泄露 静态变量导致内存泄露 非静态内部类导致内存泄露 未取消注册(BroadcastReceiver )或回调导致内存泄露 ...
- Windows定时任务copy到nfs目录
@echo off mount 192.168.5.10:/data/test x: xcopy /y "D:\backup\mysql\20200316_230000.sql.tar.gz ...
- docker搭建redis集群
一.简介 docker作为一个容器技术,在搭建资源隔离性服务上具有很大的优势,在一台服务器上可以启动多个docker容器,感觉每个在容器里面部署的服务就像是部署在不同的服务器上.此次基于docker以 ...
- XJOI 夏令营501-511NOIP训练18 高二学堂
在美丽的中山纪念中学中,有座高二学堂,同样也是因为一个人,让它们变 成了现在这个样子~那就是我们伟大的级主任.因为他,我们又迎来了一个木有电影,只有对答案的段考日:又迎来了一个不是大礼拜,而是小礼拜的 ...
- 专业之旅——GitHub 热点速览 Vol.45
作者:HelloGitHub-小鱼干 从入门到精通需要什么?AI-Expert-Roadmap 带你开启专业之旅,和 135k+ 高星项目 developer-roadmap 一样, AI-Exper ...
- <摘自>飞:jxl简析2 [ http://www.emlog.net/fei ]
[<摘自>飞:jxl简析:http://www.emlog.net/fei] (二)应用 在进行实践前 , 我们需要对 excel 有一个大致的了解 ,excel 文件由一个工作簿 (Wo ...