实例
网页中最常见的元素为文本、图片等，下面是运用文本、图片、标题等常见标签模拟制作文章详情的html页面：
<!DOCTYPE html />
<html>
<head>
<title>魔方公寓获得1.5亿美元D轮融资，未来将运营人才公寓和公租房 | 钛快讯</title>
<meta charset="utf-8" />
<link rel="stylesheet" type="text/css" href="" />
<style>
*{
margin:0px;
padding:0px;
}
div{
width:700px;
margin:0px auto;
margin-top:20px;
}
abbr{
text-decoration:none;
color:#00A4A0
}
p{
line-height:40px;
font-size:14px;
margin-bottom:20px;
}
img{
margin:30px auto;
}
h1{
font-family:"宋体"；
}
</style>
</head>
<body>
<div>
<h1>魔方公寓获得1.5亿美元D轮融资，未来将运营人才公寓和公租房 | 钛快讯</h1>
<p style="color:#B3B3BA;line-height:70px;"><abbr title="高梦阳">高梦阳</abbr> · 2019-03-11 21:24</p>
<p style="text-align:center;background:#F6F6F6;line-height:70px;"><b>摘要：</b> 新一轮融资到手后，魔方将参与到城市人才公寓建设和公租房运营管理与行业规则的制定。</p>
<img src="images/image.jpeg" width="700px" alt="这是一张图片">
<p><b style="font-size:18px;">钛媒体快讯 | 3月11日消息：</b>钛媒体获悉，魔方生活服务集团获得由加拿大机构基金管理公司CDPQ投资的1.5亿美元的D轮融资。</p>
<p>公开资料显示，魔方生活服务集团是国内的集中式长租公寓的代表，也是最早一批投身连锁长租公寓行业的创业公司。根据魔方公寓提供的信息，目前魔方是国内在营房量最大、营业收入最高的集中式公寓运营商。旗下产品包括面对都市白领的魔方公寓，面向企业蓝领的9号楼公寓，立足中高端的摩尔公寓以及面向年轻用户的V客青年公寓。</p>
<p>据钛媒体了解，本轮战略投资方加拿大魁北克储蓄投资集团（CDPQ）是一家长期投资管理机构，负责管理加拿大魁北克省的公共养老基金以及保险计划的资产。截止2018年12月31日，CDPQ 管理的基金净资产已达3,095亿加元。</p>
<p>据CDPQ亚太区私募股权投资总经理林明安向钛媒体透露，这是其在中国投资的第一个项目，而这笔融资将为魔方的未来项目拓展提供资金保障和战略支持。</p>
<p>此前，魔方公寓已完成三轮股权融资，投资方包括中航信托、美国华平集团、德同资本等，在投资并购方面，魔方先后对窝趣等国内多个知名的公寓项目进行投资。</p>
</div>
</body>
</html>运行实例 »
点击 "运行实例" 按钮查看在线实例
执行结果预览图
学习总结：
1、<h1>标签用于定义标题，在SEO中权重较高，但不能多次使用，一般用在网页的主标题中
2、加粗效果用<b>标签
3、去掉下划线用“text-decoration:none;”来实现
4、用<abbr title=""></abbr>来表现一个缩写，可用来提供更多的内容
5、<meta charset="" />用来定义字符集编码
6、可以灵活运用外部样式、内部样式、内联样式及他们之间的优先权，达到想要的效果