`

第三章:HTML的标签

    博客分类:
  • html
阅读更多

HTML特殊符号

 

空格          
大于号(>)  >
小于号(<)  &lt;
引号         &quot;
版权号©      &copy;

 

HTML超链接 

一、超链接(a标签)

  <a href="http://www.baidu.com" target="_blank">百度</a>

  target属性:  _self   _blank  _top 

  锚点应用:  href="#锚点名称"   name="锚点名称"

  

<a href="#diyi">第一章(点击此处会滑动到下面第一章位置)</a>

<a name="diyi">第一章</a><br/>
第一章内容内容<br/>
如果浏览器未出现滚动条,页面点击不会出现任何反应<br/>
只有页面有滚动条时点击时才会滑动到name="diyi"标签所在的位置<br/> 

 

  电子邮件链接

  <a  href=“mailto:邮件地址”>站长邮箱 </a>(注意不能忘了mailto)

-----------------------------------------------------------------------------------

例一:

  创建一个超链接

  在新的浏览器窗口打开链接

  锚点:链接到同一个页面的不同位置

 

HTML常用标签

一、font标签定义文字

  写法:<font size="12" color="red">文字</font>

  size:字体大小   color:字体颜色

---------------------------------------------------------------------------------------------------

二、<p> 标签定义段落

  写法:<p>文字</p>

----------------------------------------------------------------------------------------------------

三、strong/b 加粗标签

  写法:<strong>文字</strong>  用于百度 google优化  <b>文字</b>用于百度优化

  strong b 标签都是加粗标签 但是对于seo优化是有区别的 strong 权重高于 b

----------------------------------------------------------------------------------------------------

四、span标签  /Pre标签

  写法:<span>文字</span>  <pre>文字</pre>

  提示:请使用 <span> 来组合行内元素,以便通过样式来格式化它们。

          <pre>文字格式按源码的排版来显示,多用于表情

---------------------------------------------------------------------------------------------------

五、<del>标签  /<i>标签

 

  写法:<del>文字</del> 删除标签(多用于商场中商品的 原价:199.00)

         <i>文字</i>  文字斜体

 

 

marquee滚动标签

 

 

<marquee> ... </marquee>(此表情基本不会用到)

<marquee>啦啦啦,我会移动耶!</marquee>

 

设置文字移动方向:

属性:direction

  值:left 左边 , right 右边 , up 上边 , down下面

例:

<marquee direction=left>啦啦啦,我从右向左移!</marquee>

 

<marquee direction=right>啦啦啦,我从左向右移!</marquee>

 

behavior
设定滚动的方式:
alternate: 表示在两端之间来回滚动。
scroll: 表示由一端滚动到另一端,会重复。
slide:  表示由一端滚动到另一端,不会重复。
例:

 

<marquee behavior="alternate">alternate:表示在两端之间来回滚动。 </marquee>
<marquee behavior="scroll">scroll:表示由一端滚动到另一端,会重复。</marquee>
<marquee behavior="slide">slide:  表示由一端滚动到另一端,不会重复。</marquee>
 
以下为上述内容的html页面
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en">
	<head>
	<!--声明当前页面的编码集charset=gbk中文编码gb2312,charset=utf-8 国际编码-->
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<!--当前页面的三要素-->
		<title>标题</title>
		<meta name="Keywords" content="关键词,关键词">
		<meta name="description" content="描述">
		<!-- css js -->
		<style type="text/css">
			p span{color:red;}
		</style>
	</head>


	<body>
		&quot;如果&quot;上天再让我活&nbsp;&nbsp;五百&gt;&lt;年
		版权所有:&copy;绝版菜tudy
		
		<!--href连接地址 target以什么形式打开 
		默认打开方式_self(当前窗口打开) _blank(新窗口打开) _top(一般在框架中应用,嵌入到当前页面)-->
		<a href="http://www.baidu.com" target="_top">百度</a>
		
		<h3>创建锚点:href中的#后对应要滑到的name</h3>
		<a href="#diyi">第一章</a> &nbsp;<a href="#dier">第二章</a> &nbsp;<a href="#disan">第三章</a><br/><br/>
		
		<a name="diyi">第一章</a><br/>
		第一章内容内容<br/>

		<a name="dier">第二章</a><br/>
		第二章内容内容<br/>

		<a name="disan">第三章</a><br/>
		第三章内容内容<br/>
		<br/>
		
		<!--mailto 发送邮件-->
		<a href="mailto:邮件地址">发送邮件</a>
		<br/>
		测试font标签的用法:<font size="12" color="red">文字</font>
		
		<h3>P标签用法 段落标签</h3>
		<!--strong b 标签都是加粗标签 但是对于seo优化是有区别的 strong 权重高于 b-->
		<p>根据当地<strong>政府</strong>下午公布的<b>最新</b>数据,失事的客机上人员共有58人,其中26死、多人失踪。</p>
		<p>另外飞机碰擦一辆出租车<span>导致2人受伤</span>。</p><!--span标签用于控制文本样式-->
		
		<h3>pre标签用法 文字格式按源码的排版来显示 多用于表情</h3>
		<pre>
			我
			  爱
			    你
		</pre>

		删除标签(del)价格:300.00&nbsp;&nbsp;<del>原价:500.00</del>
		<i>斜体标签(i)</i>
		
		<marquee>啦啦啦,我会移动耶!</marquee>
		<marquee direction="right">啦啦啦,我从左向右移!</marquee> 

	</body>
</html>
 
JAVA技术交流群 532101200
 
分享到:
评论

相关推荐

    HTML第一章-基本标签

    在"HTML第一章-基本标签"中,我们将深入探讨这些基础元素,帮助你构建起对HTML语法的理解。 1. **HTML文档结构** 每个HTML文档都由以下基本结构组成: - `&lt;!DOCTYPE&gt;`声明:定义HTML版本,例如`&lt;!DOCTYPE html&gt;`...

    第01章【HTML5简介】-第02节:HTML语言介绍

    2. 媒体元素:`&lt;audio&gt;`和`&lt;video&gt;`元素使得在网页上直接嵌入音频和视频变得更加简单,无需依赖Flash或其他第三方插件。 3. canvas画布:`&lt;canvas&gt;`元素提供了一个基于JavaScript的绘图环境,可以动态绘制图形,...

    HTML5 The Definitive Guide to HTML5

    - **第3章:HTML入门**:详细讲解了HTML的基本语法结构,包括文档类型声明(`&lt;!DOCTYPE&gt;`)、基本标签如`&lt;html&gt;`、`&lt;head&gt;`和`&lt;body&gt;`等,以及如何构建简单的网页。 #### 三、HTML元素详解 - **第6章:HTML元素上...

    ACCP5.0html第三章家庭+上机作业

    【ACCP5.0html第三章家庭+上机作业】主要涵盖了HTML语言的基础知识和实践应用,这在IT教育中的ACCP(Accelerated Career in Computer Programming)课程中是非常重要的一环。HTML,全称为HyperText Markup Language...

    Html+Css+Javascript从入门到精通.pdf

    **第三章:设计漂亮的HTML文档** - **字符实体**:使用特殊字符增强文档可读性。 - **页面背景定制**:学习如何设置页面背景。 - **文字美化**:调整文字的颜色、字体和大小。 - **设置链接颜色**:使链接更美观。 ...

    JSP动态网站开发 第1章 JSP使用基础第2章 HTML与CSS第3章 JavaScript脚本编程…………

    **第3章:JavaScript脚本编程** JavaScript是Web开发中不可或缺的一部分,用于实现客户端的交互和动态效果。 1. **JavaScript基础**:变量、数据类型、操作符、流程控制、函数等基础知识。 2. **DOM(Document ...

    第三章:javascript-DOM对象模型-补充课件.ppt

    6. **DOM标准接口**:W3C定义了三类DOM接口,分别是Core DOM、XML DOM和HTML DOM。Core DOM适用于各种结构化文档,XML DOM专用于XML,而HTML DOM则专用于HTML文档的处理。 7. **常用DOM操作**:常见的DOM操作包括...

    【第七章】JavaScript【Script标签与访问HTML页面(1)】

    【第七章】JavaScript【Script标签与访问HTML页面(1)】是关于JavaScript编程的一个章节,主要探讨了如何在HTML文档中使用Script标签以及JavaScript如何与HTML页面进行交互。这一主题对于理解和开发动态网页至关重要...

    第三章:数据解析_Python爬虫教程_源码

    通过创建BeautifulSoup对象,我们可以解析整个HTML文档,并使用CSS选择器或方法(如`find`和`find_all`)来定位特定的标签和属性,从而提取所需的数据。 2. **lxml库**: lxml是另一个强大的解析库,它结合了...

    第一章:网页开发基础 chapter01

    在本章节"第一章:网页开发基础 chapter01"中,我们将深入探讨网页开发的基本概念和技术。这涵盖了网页的结构、样式以及动态功能的实现。网页开发是构建互联网应用的核心部分,它让信息能够以交互的方式呈现给全球...

    HTML_course.rar_html 练习题

    第三章:HTML链接与图像 本章涵盖如何创建超链接,链接到其他网页、文件或特定页面位置。还将学习如何在网页中插入和调整图像,包括使用标签和属性如src、alt等。 第四章:HTML列表和表格 学习如何创建无序列表、...

    a smarter way to learn javascript 2013

    - **第3章:用于数字的变量** —— 探讨如何声明存储数值的变量。 - **第4章:合法与非法的变量名** —— 分析哪些字符可以用于变量命名,哪些不行。 - **第5章:数学表达式:熟悉的运算符** —— 讲解加减乘除等...

    Introduction to Website Design and Development_ HTML5, CSS3, and JavaScript

    3. **第3章:头部设置舞台** - 介绍`&lt;head&gt;`标签及其重要性。 - 包括元数据、字符集、标题等元素的作用。 - 学习如何通过头部标签为网页添加关键信息。 4. **第4章:HTML标签与属性** - 详细介绍常用的HTML标签...

    Struts课件(全12章)

    第3章:Struts配置文件详解 在这一章,我们将深入研究struts-config.xml文件,它是Struts框架的核心配置文件,用于定义Action和ActionForm,以及Action的映射和结果页面。 第4章:Action和ActionForm 这章将介绍...

    HTML第3章 课堂练习 及答案 CSS ACCP6.0

    在第3章的学习中,我们将深入探讨HTML的基本结构、元素以及如何通过CSS(Cascading Style Sheets)来增强网页的样式和布局。本章节的课堂练习及答案旨在帮助你巩固所学知识,并通过实践来提升技能。 首先,让我们...

    第3章_Struts2标签库详解与AJAX技术应用.rar

    以下是一些主要的Struts2标签: 1. `&lt;s:property&gt;`:这个标签用于显示模型对象的属性值。例如,`&lt;s:property value="username" /&gt;`将显示用户对象的用户名属性。 2. `&lt;s:form&gt;`:用于创建HTML表单,它可以自动处理...

    北大青鸟html课件第三章

    在北大青鸟HTML课件第三章中,主要探讨了如何使用HTML进行表单和框架的创建,这是网页设计中至关重要的部分。表单用于收集用户数据,如注册信息、反馈和搜索请求,而框架则允许在同一个浏览器窗口中展示多个独立的...

Global site tag (gtag.js) - Google Analytics