image设置高度无效

最新推荐文章于 2024-03-01 17:29:29 发布

琅琊山二当家

最新推荐文章于 2024-03-01 17:29:29 发布

阅读量4.7k

点赞数

分类专栏： css

本文链接：https://blog.csdn.net/AlbertFly/article/details/51735055

版权

css 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

<style type="text/css">
	.imageClass{
		height:200px;
		width: 200px;
	}
</style>

</head>
<body>
	<jsp:include page="../../decorators/_common_header.jsp"></jsp:include>
	<div class="center">
		<div class="thumbnail rvt-news-center rvt-news-center-img">
		<div>
			<div class="row">
					
				<div class="col-sm-6 col-md-4">
				<div class="thumbnail rvt-news-center rvt-news-center-img">
					
					<a href="<c:url value='/news/revit/newsbimtype.html'/>"><img class ="imageClass" src='http://7xuxp3.com1.z0.glb.clouddn.com/imgae.jpg'></a>
						<br/>
						<div class="caption">

如上面所示给图片设置高度无效分析后发现是上层div 的样式影响到本层去掉

<div class="thumbnail rvt-news-center rvt-news-center-img"> 里面的thumbnail 就可以

出现这种莫名其妙问题一般是相互干扰

thumbnail 的样式来自bootstrap

.thumbnail {
	display: block;
	padding: 4px;
	margin-bottom: 20px;
	line-height: 1.42857143;
	background-color: #fff;
	border: 1px solid #ddd;
	border-radius: 4px;
	-webkit-transition: border .2s ease-in-out;
	-o-transition: border .2s ease-in-out;
	transition: border .2s ease-in-out
}
.thumbnail a>img, .thumbnail>img {
	margin-right: auto;
	margin-left: auto
}
a.thumbnail.active, a.thumbnail:focus, a.thumbnail:hover {
	border-color: #337ab7
}
.thumbnail .caption {
	padding: 9px;
	color: #333
}