HTML开发概述知识点
✍作者：柒烨带你飞
格言：生活的情况越艰难，我越感到自己更坚强；我这个人走得很慢，但我从不后退。
系列专栏：HTML入门 + 实战小案例
目录
- 前言
- 一，HTML常用元素和属性
-
- 1，文本标签元素
- 2，超链接
-
- 1. HTML 链接-target属性
- 2. HTML链接 rel属性
-
- 2. HTML 链接- id 属性
- 3，图像
- 4，表格
- 5，通用元素样式设置
-
- 1，HTML 的 style 属性
前言
HTML(Hyper Text Markup Language)
网页是一个包含HTML标签的纯文本文件网页
是一个在互联网上显示的页面文档(Web文档)，
DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>主页title>
head>
<body>
body>
html>
一，HTML常用元素和属性
，<>有开始标签和结束标签的是html元素
没有的都是属性，如：body元素后面的bgcolor就是属性
<body bgcolor=""> 设置页面背景颜色
1，文本标签元素
<font size="5" face="微软雅黑">你好，大号字体font><br/>
<font size="5" color="blue">你好，蓝色字体font><br/>
<font size="5" color="#8a2be2"><b>hello worldb>font><br/>
font后面会被弃用不赞成使用，建议使用统一样式
<h1>1h1>
<i>斜体i><br/>
<b>粗体b><br/>
<strong>强调,也是粗体strong><br/>
<p>标记p>
<span>标记span>
不换行空格
<hr/> 添加一条水平线
<br/> 换行
2，超链接
1. HTML 链接-target属性
使用 target =" "属性，你可以定义被链接的文档在何处显示。
标签的 target 属性规定在何处打开链接文档。
下面的这行会在新窗口打开文档：
<a href="https://www.runoob.com/" target="_blank" >访问菜鸟教程!a>
_black 值就是表示打开一个新窗口
还有其他值，可以去官方文档查询
2. HTML链接 rel属性
用于描述链接之间的关系
rel属性通常用来描述链接之间的关系，也就是说目的地址(href) 跟源（站点）之间的关系
rel是relationship的英文缩写
<a href="https://www.runoob.com/" target="_blank" rel="index">访问菜鸟教程!a>
index表示链接的关系是文档索引
还有其他值，可以去官方文档查询，描述链接之间的关系，有助于SEO和各网页权重有好处
2. HTML 链接- id 属性
id 属性用于为 HTML 元素指定唯一的 id
在链接里面id属性可以用于创建一个html文档书签
用法：
在一个文档中添加<a id="tips">文档一部分内容a>
然后添加一个链接，可以直接链接到，添加id属性这边
<a herf="#tips">链接到文档一部分内容a>
<a href="1.计算机网络概述.pdf">计算机网络pdfa>
<a href="tel:44545">拨打电话a>
<a href="sms:44545?body=你好，很高兴认识你">给作者发短信a>
<a href="mailto:[email protected]">给作者写邮件a>
<a href="https://www.woniuxy.com/note/938">学院文化a>
<a href="https://www.woniuxy.com/note/#938">学院文化a>
3，图像
<img src="URL" alt="预备替换文本" />
<img src="URL" alt="预备替换文本" width=""heght="" /> 设置高度与宽度
<body background="URL"> 设置页面背景图
<a href="url"><img src="url" alt="预备替换文本">a> 给图片加上超链接
<img src="URL" alt="预备替换文本" align="对齐方式" /> 图像文本排版
| align | 描述 |
|---|---|
| align= | "left"对齐左边 |
| align= | "right"对齐右边 |
| align= | "middle"中央对齐 |
| align= | "top"顶部对齐 |
| align= | "bottom"底部对齐 |
4，表格
<table>table> 表格
<thend bgcolor="">thend>页眉 + 背景色
<tr>tr>行
<td>td>单元格 rowspan="" 合并行 colspan="" 合并列
border="" 边框
cellspacing="" 单元格间距
cellpadding="" 单元格填充
bgcolor="" 单元格背景色
height="" 高度
width="" 宽度
align="" 排列对齐 左中右
valign="" 垂直对齐 上中下
5，通用元素样式设置
1，HTML 的 style 属性
提供了一种改变所有 HTML 元素的样式的通用方法。
style可以设置背景
<body style="background: #F7E606">
<p style="background-color:green">你好呀p>
style可以设置字体颜色和尺寸
<h1 style="font-family:verdana">hello worldh1>
<p style="font-family:arial;color: red;font-size: 40px;">my carp>
style可以设置文本对齐
<h1 style="text-align: center">This is a headingh1>
下面这些标签和元素，不赞成使用，在未来的html和xhtml，这些标签元素和属性将被废弃
HTML4.01
XML + HTML4.01 = XHTML1.0
HTML5 XHTML
XHTML就是比html4.01更加严格讲究标准的一个版本
Xhtml可以理解为html+xml，就是用xml的语法来规范html。其实早期html语言是比较散漫的，像1234532是可以被游览器正常解析的。后来就利用XML将html语言规范化，结构化
XHTML 1.0 是 XML 风格的 HTML 4.01。
HTML5 是下一代 HTML，取代 HTML 4.01
HTML和XML区别与联系
区别与联系
XML与HTML两种标记语言之间的区别 - 闪电博
博主的其他系列专栏
- 1 环境配置集合
- 2 C语言小实例项目
- 3 网路安全入门系列
创作不易，如果觉得文章不错或能帮助到你学习，可以点赞收藏评论+关注哦！留下你的看法和建议
我们下期见✍️