<p>
	<meta content="width=device-width, initial-scale=1" name="viewport" />
</p>
<p>
	<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
	<style type="text/css">
img {
            margin: 10px;
            padding: 10px;
            border: 1px solid;
            background-color: #FFFFBB;
            width: 400px;
            height: 267px;
        }	</style>
</p>
<div class="container">
	<h2>
		Accordion Example</h2>
	<p>
		<strong>Note:</strong> The <strong>data-parent</strong> attribute makes sure that all collapsible elements under the specified parent will be closed when one of the collapsible item is shown.</p>
	<div class="panel-group" id="accordion">
		<div class="panel panel-default">
			<div class="panel-heading">
				<h4 class="panel-title">
					<a data-parent="#accordion" data-toggle="collapse" href="#collapse1">Collapsible Group 1</a></h4>
			</div>
			<div class="panel-collapse collapse in" id="collapse1">
				<div class="panel-body">
					<img alt="" src="http://ecloud.ewang.com.tw/userUpload/images/762596.jpg" /> <img alt="" src="http://ecloud.ewang.com.tw/userUpload/images/03_IMG_0939.JPG" /> <img alt="" src="http://ecloud.ewang.com.tw/userUpload/images/04_IMG_0942.JPG" /> <img alt="" src="http://ecloud.ewang.com.tw/userUpload/images/05_IMG_0943.JPG" />
					<p class="card-text">
						客房介紹：空間寬敞且整齊的客房 擁有獨立的衛浴設備 並且有類乾濕分離的設計 讓客房有舒適整潔的環境。</p>
				</div>
			</div>
		</div>
		<div class="panel panel-default">
			<div class="panel-heading">
				<h4 class="panel-title">
					<a data-parent="#accordion" data-toggle="collapse" href="#collapse2">Collapsible Group 2</a></h4>
			</div>
			<div class="panel-collapse collapse" id="collapse2">
				<div class="panel-body">
					Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div>
			</div>
		</div>
		<div class="panel panel-default">
			<div class="panel-heading">
				<h4 class="panel-title">
					<a data-parent="#accordion" data-toggle="collapse" href="#collapse3">Collapsible Group 3</a></h4>
			</div>
			<div class="panel-collapse collapse" id="collapse3">
				<div class="panel-body">
					Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div>
			</div>
		</div>
	</div>
</div>
