删除bootstrap 3 popover上的底部阴影

时间:2018-01-28 19:28:36

标签: html css twitter-bootstrap shadow bootstrap-popover

如何删除bootstrap 3 popover上的底部阴影?

enter image description here

我在css的任何地方找不到阴影,我已经删除了我的CSS中的所有阴影。

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<style>
body {
  padding-top: 300px
}
.teamMember {
	width: 60%;
	margin: auto;
	transition: all .3s ease;
	padding: 20px;
}

.teamMember:hover {
	box-shadow: 
		4px 4px 4px rgba(0,0,0,.3),
		-4px -4px 4px rgba(0,0,0,.3);
}

.teamMember img {
	width: 50%;
}

.teamMember h4 {
	font-size: 3em;
	font-family: 'Arimo';
}

.teamMember h5 {
	text-transform: none !important;
	color: rgba(0,0,0,.7) !important;
	font-size: 2em !important;
}

.popover {
	background: rgba(0,0,0,0) url('https://i.imgur.com/mmiTupu.jpg') no-repeat center;
	background-size: cover;
	border: none;
	border-radius: 0;
	box-shadow: none !important;
	text-shadow: none !important;
}

.popover-content {
	border: none;
	border-radius: 0;
	padding: 100px;
}
</style>
<div class="container-fluid">
	<div class="row">
		<div class="col-sm-12">
			<div class="teamMember" data-placement="top" data-content="oof<br/>test">
			<img src="https://i.imgur.com/mmiTupu.jpg">
			<h4>oof</h4>
			<h5>oof</h5>
		</div>
	</div>
</div>
<script type="text/javascript">
$(document).ready(function() {
	var template = [
	'<div class="popover">',
		'<div class="popover-content">',
		'</div>',
	'</div>'
	].join('');
	$(".teamMember").popover({
		trigger: "hover",
		html: !0,
		template: template
	});
});
</script>

这个片段应该会产生同样的错误,但这不是出于某些原因,而且老实说我很困惑。我在css或dev工具中看不到阴影,所以我有点卡住了。由于代码段没有显示问题,因此现场直播:https://piggeh.org/meraki/team

任何帮助都将不胜感激。

1 个答案:

答案 0 :(得分:1)

您将无法将其删除,因为它已添加到此网址中的背景照片中:https://piggeh.org/meraki/assets/images/team/popup.png

见这里:

enter image description here

如果您想要保留没有阴影的背景,您应该在没有阴影的情况下下载并编辑上面给出的网址中的照片,然后重新上传。