HTML | 常用标签

1. 标签由英文尖括号<和>括起来,如<html>就是一个标签。

2. html中的标签一般都是成对出现的,分开始标签和结束标签。结束标签比开始标签多了一个/。

3. HTML标签不区分大小写,<h1>和<H1>是一样的,但建议小写,因为大部分程序员都以小写为准。

认识head标签

描述文档的各种属性和信息,包括文档的标题

<head>会出现在浏览器的标题栏中

<title>...</title>

<meta>

<link>

<style>...</style>

<script>...</script>

</head>

代码注释: <!--注释文字 -->

标签

<hx></hx>不同等级的标题

<p></p>段落

<em></em>斜体

<strong></strong>加粗

<span>标签是没有语义的,它的作用就是为了设置单独的样式用的。

<q></q>短文本引用

<blockquote>标签,长文本引用

<br/>分行显示文本

<hr/>添加横线,这两个都是只有开始标签没有结束标签

在html代码中输入空格、回车都是没有作用的。要想输入空格,必须写入&nbsp;。

<code></code>加入代码;多行代码可以用<pre>

ul,添加新闻信息列表

<ul>

<li>信息</li>

<li>信息</li>

......

</ul>

ul-li表示没有前后顺序

ol,添加图书销售排行榜

<ol>

<li>信息</li>

<li>信息</li>

......

</ol>

ol-li表示有序列表

<div>划分独立的逻辑模块

<div  id="版块名称">…</div>

table表格

创建表格的四个元素:

table、tbody、tr、th、td

1、<table>…</table>:整个表格以<table>标记开始、</table>标记结束。

2、<tbody>…</tbody>:如果不加<thead><tbody><tfooter> , table表格加载完后才显示。加上这些表格结构, tbody包含行的内容下载完优先显示,不必等待表格结束后在显示,同时如果表格很长,用tbody分段,可以一部分一部分地显示。(通俗理解table 可以按结构一块块的显示,不在等整个表格加载完后显示。)

3、<tr>…</tr>:表格的一行,所以有几对tr 表格就有几行。

4、<td>…</td>:表格的一个单元格,一行中包含几对<td>...</td>,说明一行中就有几列。

5、<th>…</th>:表格的头部的一个单元格,表格表头。

6、表格中列的个数,取决于一行中数据单元格的个数。

总结:

1、table表格在没有添加css样式之前,在浏览器中显示是没有表格线的

2、表头,也就是th标签中的文本默认为粗体并且居中显示

为表格添加边框:

<style type="text/css">

table tr td,th{border:1px solid #000;}

</style>

caption标签,为表格添加标题和摘要

<table summary=“表格摘要”>

<caption>标题文本</caption>

<tr>

<td>…</td>

<td>…</td>

</tr>

</table>

<a>链接到另一个页面

<a  href="目标网址"  title="鼠标滑过显示的文本">链接显示的文本</a>

<a href="目标网址" target="_blank">click here!</a> 在新的浏览器窗口中打开。

<img>标签,为网页插入图片

<img src="图片地址" alt="下载失败时的替换文本" title = "提示文本">

使用表单标签,与用户交互

<form   method="传送方式"   action="服务器文件">

猜你喜欢

转载自blog.csdn.net/weixin_41340063/article/details/82586628