01 HTML快速入门2

HTML常用行级标签

超链接标签

<a href="链接地址" target=“目标窗口”>链接文本或图片</a>

常用属性
href 指定超链接所关联的另一个资源
target 指定框架集中的哪个框架来装载另一个资源,该属性可以是_self、_blank、_top、_parent四个值,分别代表使用自身、新窗口、顶层框架、父框架来装载新资源
图像标签

<img src="图片地址" alt=“提示文字”>

span标签

<span>文本等行级内容</span>

br标签

<br/>换行

常用特殊符号

常用特殊符号符号
空格&nbsp ;
大于 >&gt ;
小于 <&lt ;
引号 “&quot ;
版权号&copy ;

frameset内嵌框架集

frameset框架集

框架文件的特点

  • 创建各个子窗口对应的HTML文件
  • 创建整个框架文件,分别引用子窗口文件

创建框架页面的基本语法

<frameset cols="25%,50%,*" rows="50%,*" border="5">
	<frame src="top.html">
	... ...
</frameset>
//注意:<frameset></frameset>标签不能与<body></body>同时使用。除非你在<frameset>中使用<noframes>标签

frameset框架集标签中的常用属性

属性
colspixels、%、*
定义框架集中列的数目和尺寸
rowspixels、%、*
定义框架集中行的数目和尺寸

例如:垂直框架

<html>
	<frameset cols="25%,50%,25%">
	<frame src="/example/html/frame_a.html">
	<frame src="/example/html/frame_b.html">
	<frame src="/example/html/frame_c.html">
	</frameset>
</html>
<html>
	<frameset rows="25%,50%,25%">
	<frame src="/example/html/frame_a.html">
	<frame src="/example/html/frame_b.html">
	<frame src="/example/html/frame_c.html">
	</frameset>
</html>

.

做一如下所示的小网页
Net Web

//=============================index.html=============================//
<!DOCTYPE HTML>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=gb2312"/>
		<title>海同科技信息技术有限公司</title>
		<meta name="author" content="chenhao"/>
		<meta name="Description" content="海同科技是一家集猎头、IT培训和软件外包的综合性公司"/>
		<meta name="keywords" content="猎头,IT培训,外包"/>
	</head>

	<frameset rows="30%,*">
		<frame src="top.html" name="topFrame"/>
		<frameset cols="20%,*">
			<frame name="leftFrame" src="left.html" noresize="noresize"/>
			<frame name="rightFrame" src="page1.html">
		</frameset>
		<noframes>
			<body>
				此浏览器不支持框架协议!
			</body>
		</noframes>
	</frameset>
</html>
//=============================left.html=============================//
<!DOCTYPE html>
<html>
	<head>
		<title>top</title>
	</head>
	<body bgcolor="yellow">
		<h3><a href="page1.html"  target="rightFrame">翻译服务</h3>
		<h3><a href="page2.html"  target="rightFrame">网站建设</h3>
		<h3><a href="page3.html"  target="rightFrame">服务流程</h3>
	</body>
</html>
//=============================page1.html=============================//
<!DOCTYPE html>
<html>
	<head>
		<title>翻译服务</title>
		<meta http-equiv="Content-Type" context="text/html; charset=gbk"/>
	</head>

	<body>
		<h1>为您提供精准的翻译服务</h1>
		<p>您是否要将某些文档翻译成标准的英语版本?您是否担心译文会不符合西方语系的语言习惯?您是否遇到语言障碍而放缓向境外拓展业务的步伐?您是否受到时而需要处理外文资料的困扰?</p>
		<p>让我们来帮您解决这些问题。我们这里提供的服务快捷、高效、准确,而且付费方便。您无需走出家门,就可同我们一起走完服务的全过程,甚至包括付费。</p>
		<p>我们有来自中国和新加坡的翻译专家,他们具有得天独厚的语言基础和深厚的文化背景。他们合作的结晶一定是非常贴切而精美的译文作品。我们会分配以您的目标语种为母语的翻译员为你翻译,同时他们也精通您的源语语种。</p>
		<p>您若由此需求或任何疑问,请浏览我们的网站,也可随时同我们联系,您会得到耐心的解答。我们的联系方式是:<u>demo@demo.com</u></p>
	</body>
</html>
//=============================page2.html=============================//
<!DOCTYPE html>
<html>
	<head>
		<title>网站建设</title>
		<meta http-equiv="Content-Type" context="text/html; charset=gbk"/>
	</head>

	<body>
		<h1>网站建设</h1>
		<p>一副美观而高效的页面、一个强而有力的标志是其所有者的形象,也是他向外展示自己而给人留下深刻印象的第一个机会。它所具有的美应该能抓住浏览者的眼睛,它所包含的内容应该能锁住它们的心。</p>
		<p>这需要一支熟练而具有市场观念的团队来实现。这就是您选择“World-Trans”的原因,让我们来帮您实现上述目的。我们的团队会把他们丰富的经验、知识及才敢注入到您的网站中。</p>
		<p>当然,如果您需要,由于我们得天独厚的业务专长,我们也可以将您的网站无缝地制作成英文版/中文版。</p>
		<p>敬请垂询:<u>demo@demo.com</u></p>
	</body>
</html>
//=============================page3.html=============================//
<!DOCTYPE html>
<html>
	<head>
		<title>服务流程</title>
		<meta http-equiv="Content-Type" context="text/html; charset=gbk"/>
	</head>

	<body>
		<h1>服务流程</h1>
		<p>首先烦请您将需求用E-mail的方式发给我们,我们承诺决不泄露其内容。</p>
		<p>请您上传至:demo@demo.com</p>
		<p>我们会回复您服务的价格,同时会给您一个业务号。</p>
		<p>您若接受,便可在我们列出的付费方式中任选一种付费,之后发E-mail通知我们,请一并告知我们分配给您的业务号和银行转账的业务号。款一到,我们立刻通知您翻译工作已在进行中,并同您保持联络。</p>
	</body>
</html>
//=============================top.html=============================//
<!DOCTYPE html>
<html>
	<head>
		<title>top</title>
		<meta http-equiv="Content-Type" context="text/html; charset=gbk"/>
	</head>
	<body>
		<img src="nanjing_street.jpg" weight="1600" height="600">
	</body>
</html>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值