HTML·第四章课后习题

1.使用HBuilder编写符合以下要求的文档:在浏览器窗口中显示超链接文字"WEL-COME"。完成效果如图4-10所示。其中上边div的背景颜色为#FF99CC,文字居中显示;水平分割线粗细为5,颜色为#FF99CC;超链接文字的字体为"arial black",字号为60px,频色为#FFF,无下划线;当鼠标滑过文字变为#FFOOFF;当鼠标按下文字变为#FFOOCC;访问过后连接文字变为#FFFFCC。脚部文字颜色为#666。CSS样式采用内部样式表。

html 复制代码
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>WEL-COME</title>
		<style>
			a{
				font-size: 60px;
				font-family: "arial black";
			}
			a:link{
				color: #ffffcc;
			       }
			a:visited{
				color: #ffaa00;
				     }
			a:hover{
					color: #ff00ff;
				    }   
			#head{
				    text-align: center;
				    background-color: #ff99cc;
					padding: 60px;
				}
			#footing{
				    color: #666;
					text-align: center;
				}
				
		</style>
	</head>
	<body>
		<div id='head'>
		   <a href="https://www.jxatei.net" target="_blank">WEL-COME</a><br/>
		   <a href="https://mortaltom.blog.csdn.net" target="_blank">MortalTom博客</a>
		</div>
		<hr size="5" color="#ff99cc"/>
		<div id='footing'>Copyright &copy;2024 MortalTom</div>
	</body>
</html>

效果图:


2.使用HBuilder编写符合以下要求的文档:使用所给素材文件夹中的HuaWei.jpg和文字,完成效果如图4-11所示。网页采用链接外部样式表的方式。内容部分的div宽度设置为居中(margin-right:auto;margin-left:auto;)。根据网页效果,使用h1,h2,设置标题。"为客户创造价值"等语句,使用内联样式,加粗,加大。

html 复制代码
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>公司简介</title>
		<style>
			#div{
				margin-right: auto;
				margin-left:auto ;
			}
			.content{
				text-indent: 2em;
			}
		</style>
	</head>
		<body>
			<div id="div">
				<img src="img/HuaWei.jpg"/>
				<h1>公司简介</h1>
				<p class="content">
					华为是全球领先的ICT(信息与通信)基础设施和智能终端提供商,致力于把数字世界带入每个人、每个家庭、每个组织,构建万物互联的智能世界。我们在通信网络、IT、智能终端和云服务等领域为客户提供有竞争力、安全可信赖的产品、解决方案与服务,与生态伙伴开放合作,持续为客户创造价值,释放个人潜能,丰富家庭生活,激发组织创新。华为坚持围绕客户需求持续创新,加大基础研究投入,厚积薄发,推动世界进步。华为成立于1987年,是一家由员工持有全部股份的民营企业,目前有18万员工,业务遍及170多个国家和地区。
				</p >
				<h2>我们为世界带来了什么?</h2>
				
				<p class="content">
					<a style="font-weight: bold;font-size:20px;">为客户创造价值。</a >华为和运营商一起,在全球建设了1,500多张网络,帮助世界超过三分之一的人口实现联接。华为携手合作伙伴,为政府及公共事业机构,金融、能源、交通、制造等企业客户,提供开放、灵活、安全的端管云协同ICT基础设施平台,推动行业数字化转型;为云服务客户提供稳定可靠、安全可信和可持续演进的云服务。华为智能终端和智能手机,正在帮助人们享受高品质的数字工作、生活和娱乐体验。
				</p >
				<p class="content">
					<a style="font-weight: bold;font-size:20px;">推动产业良性发展。</a >华为主张开放、合作、共赢,与客户合作伙伴及友商合作创新、扩大产业价值,形成健康良性的产业生态系统。华为加入360多个标准组织、产业联盟和开源社区,积极参与和支持主流标准的制定、构建共赢的生态圈。我们面向云计算、NFV/SDN、5G等新兴热点领域,与产业伙伴分工协作,推动产业持续良性发展。
				</p >
				<p class="content">
					<a style="font-weight: bold;font-size:20px;">为促进经济增长。</a >华为不仅为所在国家带来直接的税收贡献,促进当地就业,形成产业链带动效应,更重要的是通过创新的ICT解决方案打造数字化引擎,推动各行各业数字化转型,促进经济增长,提升人们的生活质量与福祉。
				</p >
				<p class="content">
					<a style="font-weight: bold;font-size:20px;">为推动社会可持续发展。</a >作为负责任的企业公民,华为致力于消除全球数字鸿沟,在珠峰南坡和北极圈内,在西非埃博拉疫区、日本海啸核泄漏、中国汶川大地震等重大灾难现场,都有华为人的身影;推进绿色、低碳的环保理念,从产品规划、设计、研发、制造、交付以及运维,华为向客户提供领先的节能环保产品和解决方案;华为"未来种子"项目已经覆盖108个国家和地区,帮助培养本地ICT人才,推动知识迁移,提升人们对于ICT行业的了解和兴趣,并鼓励各国家及地区参与到建设数字化社区的工作中。
				</p >
				<p class="content">
					<a style="font-weight: bold;font-size:20px;">为为奋斗者提供舞台。</a >华为坚持"以奋斗者为本",以责任贡献来评价员工和选拔干部,为员工提供了全球化发展平台、与世界对话的机会,使大量年轻人有机会担当重任,快速成长,也使得十几万员工通过个人的努力,收获了合理的回报与值得回味的人生经历。
				</p >
				<h2>我们坚持什么?</h2>
				<p class="content">
					华为30年坚持聚焦在主航道,抵制一切诱惑;坚持不走捷径,拒绝机会主义,踏踏实实,长期投入,厚积薄发;坚持以客户为中心,以奋斗者为本,长期艰苦奋斗,坚持自我批判。
				</p >
				<p class="content">
					我们不会辜负时代慷慨赋予我们的历史性机遇,为构建万物互联的智能世界,一往无前。
				</p >
			</div>
		<div align="center">Copyright &copy;2024 MortalTom</div>
		</body>
</html>

演示图:

相关推荐
捧 花23 分钟前
FastAPI 基础语法:从一个完整接口理解 Web API 的设计
前端·python·fastapi·middleware
Hilaku29 分钟前
一行 CSS 新特性干掉 20 行 JavaScript ?
前端·javascript·程序员
风月说与山鬼35 分钟前
JS闭包详解
开发语言·javascript
JarvanMo43 分钟前
AI 写代码暴增 161 倍,移动开发有没有变得更差?
前端
梦曦i1 小时前
RouterLink v2.5.0:H5端原生能力全面回归
前端·uni-app
小林ixn1 小时前
React + Zustand + JWT:从零实现登录鉴权与请求拦截
前端·react.js·前端框架
葡萄城技术团队1 小时前
下拉多选类型单元格:在 SpreadJS 里接入 xm\-select
前端
粥里有勺糖1 小时前
视野修炼-技术周刊第130期 | 光影效果
前端·javascript·github
小岛前端2 小时前
AI Skills 已经封神,但新的问题却越来越严重!
前端·后端·github
拖孩2 小时前
一个人 + AI 做的小程序,上线 15 天赚了 10 块 5
前端·后端·微信小程序