Uikit - 使每个面板的高度/宽度相同?

时间:2016-08-15 10:30:35

标签: uikit height width panels

有人可以帮我解决这个问题吗?如何将我已经放在一起的以下内容制作成每个图像面板,我的乐队徽标的高度和宽度相同?对于uikit来说仍然是非常新的,因此无法访问在线文档。



<!DOCTYPE html> 
<html> 
<head> 
<meta charset="utf-8" /> 
		<title>4WAPEX3</title> 
		<link rel="stylesheet" href="css/uikit.css" /> 
		<script src="jquery/jquery-2.1.3.js">
		</script> <script src="js/uikit.min.js">
		</script> 
	</head> 
	<body> 
		<ul class="uk-grid uk-grid-width-small-1-2 uk-grid-width-medium-1-3 uk-grid-width-large-1-5" data-uk-grid-margin>


				<li>
					<div class="uk-panel uk-panel-box uk-panel-box-primary uk-text-center uk-text-large uk-text-bold "> 
					<div class="uk-panel-teaser"> 
					<img src="images/metallica.jpg" alt="metallica" width="100%"/>
					</div> Metallica
					</div>
				<li>
					<div class="uk-panel uk-panel-box uk-panel-box-primary uk-text-center uk-text-large uk-text-bold"> 
					<div class="uk-panel-teaser"> 
					<img src="images/nin.jpg" alt="nine inch nails" width="100%"/>
					</div> Nine Inch Nails
					</div>
				<li>
					<div class="uk-panel uk-panel-box uk-panel-box-primary uk-text-center uk-text-large uk-text-bold"> 
					<div class="uk-panel-teaser"> 
					<img src="images/tbe.jpg" alt="the butterfly effect" width="100%"/>
					</div> The Butterfly Effect
					</div>
				<li>
					<div class="uk-panel uk-panel-box uk-panel-box-primary uk-text-center uk-text-large uk-text-bold"> 
					<div class="uk-panel-teaser"> 
					<img src="images/tool.jpg" alt="tool" width="100%"/>
					</div> Tool
					</div>
				<li>
					<div class="uk-panel uk-panel-box uk-panel-box-primary uk-text-center uk-text-large uk-text-bold"> 
					<div class="uk-panel-teaser"> 
					<img src="images/tfn.jpg" alt="twelve foot ninja" width="100%"/>
					</div> Twelve Foot Ninja
					</div>
		</div>
		</div>
</html>
	</body> 
&#13;
&#13;
&#13;

由于

0 个答案:

没有答案