第三章:HTML的标签

tudy

浏览: 40322 次
性别:
来自: 北京

最近访客更多访客>>

qq909670360

PeterCarlyle

jacky_X

flyfeifei66

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

html

html css web 前端开发

HTML特殊符号

空格         &nbsp;
大于号（>）  &gt;
小于号（<）  &lt;
引号         &quot;
版权号©      &copy;

HTML超链接

一、超链接（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标签定义文字

写法:文字

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

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

二、 标签定义段落

写法:文字

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

三、strong/b 加粗标签

写法:文字 用于百度 google优化 文字用于百度优化

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

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

四、span标签 /Pre标签

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

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

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

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

五、<del>标签 /标签

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

文字 文字斜体

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的语法

2015-02-04 22:24
浏览 450
评论(0)
分类:Web前端
查看更多

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论