care.html 5.1 KB
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

	<head>
		<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no">
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<link rel="stylesheet" type="text/css" href="css/base.css" />
		<link rel="stylesheet" type="text/css" href="css/style.css" />
		<script src="js/base.js" type="text/javascript" charset="utf-8"></script>
		<title>专业护理</title>
	</head>
	<style type="text/css">
		.cali1 ul li {
			width: 31%;
			overflow: hidden;
		}
		
		.item_list {
			display: flex;
			flex-wrap: wrap;
		}
		
		.style_list img {
			width: 0.87rem;
			margin-left: 0.1rem;
			margin-right: 0.1rem;
		}
		
		.style_list {
			display: flex;
			flex-wrap: wrap;
			width: 100%;
			padding: 0.1rem 0;
		}
		
		.style_item {
			height: 1.5rem;
			display: flex;
			align-items: center;
			width: 3.68rem;
			box-sizing: border-box;
			padding: 0.24rem 0;
			border-bottom: 1px solid  #EBEBEB;
			padding-left: 0.16rem;
		}
		.style_item:nth-child(odd){
			border-right: 1px solid #EBEBEB;
		}
		.catitle {
			line-height: 0.3rem;
			margin-bottom: 0.08rem;
		}
		.cadesc {
			width: 2.3rem;
			text-overflow: ellipsis;
			white-space: nowrap;
			overflow: hidden;
		}
		.cali ul li{
			margin-left: 0.49rem
		}
		.cali ul li:nth-child(4n){
			margin-left: 0;
		}
		.cali ul li:first-child{
			margin-left: 0;
		}
	</style>

	<body>
		<div class="header center">
			<div class="left back">
				<a href="#" onClick="javascript:history.back(-1);"><img src="images/care_03.jpg" /></a>
			</div>
			<div class="headertext">专业护理</div>
			<div class="banner"><img src="images/care_06.jpg" /></div>
		</div>
		<!--capart1-->
		<div class="capart1">
			<div class="box">
				<P class="parttitle"><span class="c1">专业</span><span class="c2">护理</span> <span class="c3">|   &nbsp;优质上门护理服务推荐</span></P>
				<div class="camg cali1">
					<ul class="center">
						<li>
							<a href="home.html.html">
								<p class="tx">居家照护</p>
								<p><span class="camo">270</span>元起</p><img src="images/camg_03.jpg" /></a>
						</li>
						<li>
							<a href="#">
								<p class="tx">住院照护</p>
								<p><span class="camo">300</span>元起</p><img src="images/camg_05.jpg" /></a>
						</li>
						<li>
							<a href="#">
								<p class="tx">陪诊</p>
								<p><span class="camo">210</span>元起</p><img src="images/camg_07.jpg" /></a>
						</li>
					</ul>
				</div>
			</div>
		</div>
		<!--capart2-->
		<div class="capart2">
			<div class="style_list">
				<div class="style_item">
					<img src="images/cali_03.jpg" class="left" />
					<div class="left">
						<P class="catitle">上门打针</P>
						<P class="cadesc">提供皮下及肌肉注射</P>
					</div>
				</div>
				<div class="style_item">
					<img src="images/cali_09.jpg" class="left" />
					<div class="left">
						<P class="catitle">上门打针</P>
						<P class="cadesc">提供皮下及肌肉注射</P>
					</div>
				</div>
				<div class="style_item">
					<img src="images/cali_05.jpg" class="left" />
					<div class="left">
						<P class="catitle">上门打针</P>
						<P class="cadesc">提供皮下及肌肉注射</P>
					</div>
				</div>
				<div class="style_item">
					<img src="images/cali_03.jpg" class="left" />
					<div class="left">
						<P class="catitle">上门打针</P>
						<P class="cadesc">提供皮下及肌肉注射</P>
					</div>
				</div>
				<div class="style_item">
					<img src="images/cali_09.jpg" class="left" />
					<div class="left">
						<P class="catitle">上门打针</P>
						<P class="cadesc">提供皮下及肌肉注射</P>
					</div>
				</div>
				<div class="style_item">
					<img src="images/cali_05.jpg" class="left" />
					<div class="left">
						<P class="catitle">上门打针</P>
						<P class="cadesc">提供皮下及肌肉注射</P>
					</div>
				</div>
			</div>

		</div>
		<!--capart3-->
		<div class="capart3">
			<div class="box">
				<P class="parttitle" style="display: flex;align-items: baseline;"><span class="c1">相关</span><span class="c2">服务</span> <span class="c3">|   &nbsp;更多优质服务推介</span></P>
				<div class="camg cali">
					<ul class="center" style="display: flex; justify-content: flex-start;flex-wrap: wrap;">
						<li>
							<a href="#"><img src="images/caserver_03.jpg" />
								<p class="tx">老年痴呆护理</p>
								<p><span class="camo">596</span></p>
							</a>
						</li>
						<li>
							<a href="#"><img src="images/caserver_05.jpg" />
								<p class="tx">癌症护理</p>
								<p><span class="camo">596</span></p>
							</a>
						</li>
						<li>
							<a href="#"><img src="images/caserver_07.jpg" />
								<p class="tx">帕金森护理</p>
								<p><span class="camo">596</span></p>
							</a>
						</li>
						<li>
							<a href="#"><img src="images/caserver_07.jpg" />
								<p class="tx">帕金森护理</p>
								<p><span class="camo">596</span></p>
							</a>
						</li>
					</ul>
				</div>
			</div>
		</div>

	</body>