Web01_HTML
语法和规范:
1.所有的HTML文件后缀名都是以.html或者.htm结尾的,建议使用.html结尾
2.整个html文件分别由头部分<head></head>和体部分<body></body>组成
3.html标签都是由开始标签和结束标签组成<br />
4.html标签忽略大小写,建议大家使用小写
HTML相关标签的学习
1.标题标签
HTML 标题
在 HTML 文档中,标题很重要。
HTML 标题
标题(Heading)是通过 <h1> - <h6> 等标签进行定义的。
<h1> 定义最大的标题。<h6> 定义最小的标题。
实例
<h1>This is a heading</h1>
<h2>This is a heading</h2>
<h3>This is a heading</h3>
HTML 水平线
<hr /> 标签在 HTML 页面中创建水平线。
hr 元素可用于分隔内容。
实例
<p>This is a paragraph</p>
<hr />
<p>This is a paragraph</p>
<hr />
<p>This is a paragraph</p>
HTML 段落
可以把 HTML 文档分割为若干段落。
HTML 段落
段落是通过 <p> 标签定义的。
实例
<p>This is a paragraph</p>
<p>This is another paragraph</p>
注释:
HTML 注释
注释标签 <!-- 与 --> 用于在 HTML 插入注释。
HTML 注释标签
您能够通过如下语法向 HTML 源代码添加注释:
实例
<!-- 在此处写注释 -->
HTML 链接
HTML 使用超级链接与网络上的另一个文档相连。
几乎可以在所有的网页中找到链接。点击链接可以从一张页面跳转到另一张页面。
HTML 超链接(链接)
超链接可以是一个字,一个词,或者一组词,也可以是一幅图像,您可以点击这些内容来跳转到新的文档或者当前文档中的某个部分。
当您把鼠标指针移动到网页中的某个链接上时,箭头会变为一只小手。
我们通过使用 <a> 标签在 HTML 中创建链接。
有两种使用 <a> 标签的方式:
- 通过使用 href 属性 - 创建指向另一个文档的链接
- 通过使用 name 属性 - 创建文档内的书签
延伸阅读:什么是超文本?
HTML 链接语法
链接的 HTML 代码很简单。它类似这样:
<a href="url">Link text</a>
href 属性规定链接的目标。
开始标签和结束标签之间的文字被作为超级链接来显示。
实例
<a href="http://www.w3school.com.cn/">Visit W3School</a>
上面这行代码显示为:Visit W3School
点击这个超链接会把用户带到 W3School 的首页。
提示:"链接文本" 不必一定是文本。图片或其他 HTML 元素都可以成为链接。
HTML 图像
通过使用 HTML,可以在文档中显示图像。
图像标签(<img>)和源属性(Src)
在 HTML 中,图像由 <img> 标签定义。
<img> 是空标签,意思是说,它只包含属性,并且没有闭合标签。
要在页面上显示图像,你需要使用源属性(src)。src 指 "source"。源属性的值是图像的 URL 地址。
定义图像的语法是:
<img src="url" />
HTML 表格
你可以使用 HTML 创建表格。
表格
表格由 <table> 标签来定义。每个表格均有若干行(由 <tr> 标签定义),每行被分割为若干单元格(由 <td> 标签定义)。字母 td 指表格数据(table data),即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。
<table border="1">
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>
在浏览器显示如下:
| row 1, cell 1 | row 1, cell 2 |
| row 2, cell 1 | row 2, cell 2 |
HTML 列表
HTML 支持有序、无序和定义列表
无序列表
无序列表是一个项目的列表,此列项目使用粗体圆点(典型的小黑圆圈)进行标记。
无序列表始于 <ul> 标签。每个列表项始于 <li>。
<ul>
<li>Coffee</li>
<li>Milk</li>
</ul>
浏览器显示如下:
- Coffee
- Milk
列表项内部可以使用段落、换行符、图片、链接以及其他列表等等。
有序列表
同样,有序列表也是一列项目,列表项目使用数字进行标记。
有序列表始于 <ol> 标签。每个列表项始于 <li> 标签。
<ol>
<li>Coffee</li>
<li>Milk</li>
</ol>
浏览器显示如下:
- Coffee
- Milk
列表项内部可以使用段落、换行符、图片、链接以及其他列表等等。
字体标签
字体标签使用<font></font>
Web01_HTML的更多相关文章
- 【javaweb学习笔记】WEB01_HTML
案例一:网站信息显示页面1.什么是HTML?(Hyper Text Markup Language:超文本标记语言) 超文本:功能比普通文本更加强大 标记语言:使用一组标签对内容进行描述的一门语言(它 ...
- 【JAVAWEB学习笔记】01_HTML
案例一:网站信息显示页面1.什么是HTML?(Hyper Text Markup Language:超文本标记语言) 超文本:功能比普通文本更加强大 标记语言:使用一组标签对内容进行描述的一门语言(它 ...
- HTML01
1.什么是HTML?(Hyper Text Markup Language:超文本标记语言) 超文本:功能比普通文本更加强大 标记语言:使用一组标签对内容进行描述的一门语言(它不是编程语言) 2.为什 ...
随机推荐
- WinMain lpCmdLine
int APIENTRY WinMain(HINSTANCE hInst, HINSTANCE, LPSTR lpCmdLine, int){ //命令行参数 TCHAR pCommandLine[2 ...
- 【洛谷P4173】残缺的字符串
题目大意:给定一个文本串和一个模板串,串中含有通配符,求文本串中有多少个位置可以与文本串完全匹配. 题解:利用卷积求解字符串匹配问题. 通配符字符串匹配的数值表示为 \[\sum\limits_{i ...
- CSS 多行省略失效 (-webkit-box-orient 失效) Second Autoprefixer control comment was ignored. Autoprefixer applies control comment to whole block, not to next rules.
webpck不能编译这个属性-webkit-box-orient: vertical https://github.com/fanyifanbumaimeng/Articles/issues/48 / ...
- autofs 自动挂载.
autofs 自动挂载. 操作环境:redhat 6 一.autofs 说明 自动挂载器是一个监视目录的守护进程,并在目标子目录被引用时,自动执行预定义的挂载 自动挂载器由autofs服务脚本管理 自 ...
- python类内置方法的再学习
对于__setitem__和__getitem__方法:其入参看来是固定的(__getitem__(self, item),__setitem__(self, key, value)),我们并不需要重 ...
- 记二进制搭建k8s集群完成后,部署时容器一直在创建中的问题
gcr.io/google_containers/pause-amd64:3.0这个容器镜像国内不能下载容器一直创建中是这个原因 在kubelet.service中配置 systemctl daemo ...
- Python 创建数据库表
创建数据库表 如果数据库连接存在我们可以使用execute()方法来为数据库创建表,如下所示创建表EMPLOYEE: #!/usr/bin/python # -*- coding: UTF-8 -*- ...
- PHP 下载+安装
1.官网下载 官网地址:http://PHP.net/ 地址:http://download.csdn.NET/detail/anndy_/9494632 官网手册:https://secure.ph ...
- 快速搭建 Serverless 人脸识别离线服务
简介 首先介绍下在本文出现的几个比较重要的概念: 函数计算(Function Compute):函数计算是一个事件驱动的服务,通过函数计算,用户无需管理服务器等运行情况,只需编写代码并上传.函数计算准 ...
- Luogu P4708 画画 (Burnside引理、组合计数)
题目链接 https://www.luogu.org/problem/P4708 题解 看上去Luogu P4706-4709是Sdchr神仙出的一场比赛,一道水题和三道很有趣的题终于全过了纪念QAQ ...