前端菜鸟入坑之HTML

最新推荐文章于 2024-07-15 21:57:21 发布

Wake@Up

最新推荐文章于 2024-07-15 21:57:21 发布

阅读量117

点赞数

分类专栏： Web前端文章标签：前端 HTML 基础入门

本文链接：https://blog.csdn.net/weixin_45497812/article/details/98629449

版权

Web前端专栏收录该内容

1 篇文章 0 订阅

订阅专栏

HTML 基础学习

**注意：**学习内容均来自[http://www.runoob.com/html]，如有侵权请联系删除。

HTML：

超文本标记语言（HyperText Markup Language，简称：HTML），不是一种编程语言，而是一种用于创建网页的标准标记语言。可以使用 HTML 来建立自己的 WEB 站点，HTML 运行在浏览器上，由浏览器来解析。

这里写图片描述

小记：
（一）

HTML文档以<html>开头，以</html>结尾，<body>为文档的主题。
通用声明：<!DOCTYPE HTML>。
牵扯到中文乱码需声明<meta charset="UTF-8">。
HTML空元素，没有内容的 HTML 元素被称为空元素，例如<br>、<input>，一般于元素结束前使用"/"关闭元素，例如<br />、<input />。
HTML不区分大小写，但是最好使用小写标签。养成良好习惯，如果元素不关闭，一般浏览器都可兼容，但是可能会产生一些意想不到的结果和错误。
HTML属性，以name="value"形式存在，需注意引号的使用，eg: <a href="http://www.baidu.com">。
HTML中的id属性在单页面中应该元素名唯一；
HTML链接元素<a>，发送邮件：<a href="mailto:zhangsan1@163.com?cc=someone@163.com&bcc=somebody@163.com" rel="nofollow">发送邮件</a>：mailto:name@email.com 邮件接收地址；cc=name@email.com 抄送地址；bcc=name@email.com 密件抄送地址；subject=subject text 邮件主题；body=body text 邮件内容。注：多个邮件地址用 ; 隔开，空格用 %20 代替。
HTML头部：<title> - 定义了HTML文档的标题； <base> - 定义页面中所有链接默认的链接目标地址； <meta> - 用于描述HTML文档的描述，关键词，作者，字符集等。
<head>元素包含了所有的头部标签元素。在<head>元素中你可以插入脚本（scripts）、样式文件（CSS）、及各种meta信息。可以添加在头部区域的元素标签为:<title>、<style>、<meta>、<link>、<script>、<noscript>、<base>等；
每30秒钟刷新当前页面：<meta http-equiv="refresh" content="30">。
<link>标签可用于控制页面title旁的图片：
<head>
<link rel="shortcup icon" href="https://csdnimg.cn/public/favicon.ico">
<title>这是一个带图片的title标签</title>
</head>

（二）

HTML样式 – CSS（为了更好的渲染HTML元素而引入），添加方式如下：
1. 内联样式- 在HTML元素中使用"style" 属性
2. 内部样式表 -在HTML文档头部 <head> 区域使用<style> 元素来包含CSS
3. 外部引用 - 使用外部 CSS 文件最推荐使用
不建议使用的标签有: <font>、 <center>、 <strike>；不建议使用的属性: color 和 bgcolor。
<img src="boat.gif" alt="Big Boat">alt 属性用来为图像定义一串预备的可替换的文本。在浏览器无法载入图像时，替换文本属性告诉读者她们失去的信息。此时，浏览器将显示这个替代性的文本而不是图像。为页面上的图像都加上替换文本属性是个好习惯，这样有助于更好的显示信息，并且对于那些使用纯文本浏览器的人来说是非常有用的。
HTML图像标签：<img>、<map>、<area>，三者组合使用可实现图片分区点击效果不同。
shape指的是点击区域的形状，coords指的应该是链接区域在图片中的坐标（像素为单位）
HTML表格：表格由 <table> 标签来定义。每个表格均有若干行（由 <tr> 标签定义），每行被分割为若干单元格（由 <td> 标签定义）。字母 td 指表格数据（table data），即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。
HTML中的table可以大致分为三个部分：
thead ---------表格的页眉
tbody ---------表格的主体
tfoot ---------定义表格的页
HTML列表：有序列表<ol><li></li>...</ol>(列表用数字排序，ol的type属性决定排序方式，例如：type=“A”，从大写A开始排序)；无序列表<ul><li></li>...</ul>（粗体圆点标记，ul使用style属性决定排序样式，例如：style=“list-style-type:square”，实心方块标记每一列）；定义列表（以 <dl> 标签开始。每个自定义列表项以 <dt> 开始。每个自定义列表项的定义以<dd> 开始。）。
大多数 HTML 元素被定义为块级元素或内联元素。块级元素在浏览器显示时，通常会以新行来开始（和结束）:div、p。内联元素在显示时通常不会以新行开始：span。
<input type="reset">定义重置按钮；单选按钮radio：当设置 checked=“checked” 时，该选项被默认选中。
HTML框架：iframe。通过使用框架，你可以在同一个浏览器窗口中显示不止一个页面。
HTML脚本：javascript。使 HTML 页面具有更强的动态和交互性。
<script> document.write("Hello World!") </script>
<noscript> 抱歉，你的浏览器不支持 JavaScript! </noscript>
<p>不支持 JavaScript 的浏览器会使用 <noscript>元素中定义的内容（文本）来替代。</p>
HTML URL，统一资源定位器。Web浏览器通过URL从Web服务器请求页面。一个统一资源定位器(URL) 用于定位万维网上的文档。URL 只能使用 ASCII 字符集来通过因特网进行发送。由于 URL 常常会包含 ASCII 集合之外的字符，URL 必须转换为有效的 ASCII 格式。URL 编码使用 “%” 其后跟随两位的十六进制数来替换非 ASCII 字符。URL 不能包含空格： URL 编码通常使用 + 来替换空格。

总结

HTML 是一种在 Web 上使用的通用标记语言。HTML 允许你格式化文本，添加图片，创建链接、输入表单、框架和表格等等，并可将之存为文本文件，浏览器即可读取和显示。

HTML 的关键是标签，其作用是指示将出现的内容。

学习 CSS
CSS被用来同时控制多重网页的样式和布局。通过使用 CSS，所有的格式化均可从 HTML中剥离出来，并存储于一个独立的文件中。
学习JavaScript
JavaScript 可以让你的网页更加生动。如果你只想展示内容，静态网站是很好的展示形象，如果你想与用户进行交换或者让网页更加生动那就需要使用到Javascript。JavaScript是互联网上最流行的脚本语言，目前所有主流浏览器都支持Javascript。
站点服务器
在自己的服务器上托管网站始终是一个选项。需注意：
1. 硬件支出 - 如果要运行"真正"的网站，您不得不购买强大的服务器硬件。不要指望低价的 PC 能够应付这些工作。您还需要稳定的（一天 24 小时）高速连接。
2. 软件支出 - 服务器授权通常比客户端授权更昂贵。同时请注意，服务器授权也许有用户数量限制。
3. 人工费用 - 不要指望低廉的人工费用。必须安装自己的硬件和软件。同时要处理漏洞和病毒，以确保服务器时刻正常地运行于一个"任何事都可能发生"的环境中。
使用因特网服务提供商（ISP）
从ISP租用服务器也很常见。大多数小公司会把网站存放在由ISP提供的服务器上。其优势有以下几点：

连接速度
大多数ISP都拥有连接英特网的高速连接。

强大的硬件
ISP的web服务器通常强大到能够有若干网站分享资源，还得看一下ISP是否提供高效的负载平衡，以及必要的备份服务器。

安全性和可靠性
ISP是网站托管方面的专家。他们应该提供99%以上的在线时间，最新的软件补丁，以及最好的病毒防护。

--------------------------------------------------------- END ---------------------------------------------------------