<分区>
我在显示某些文本的背景时遇到了一些问题。 背景应该与一些(真实的)文本一起显示(在中心)，就像一个按钮但不可点击。 我有一张 150x24 像素的背景图片。 然而，一旦使用我的 css 显示，按钮的大小可达 940x150。
因为我是 CSS 的初学者，我想我在这里遗漏了一些东西......
我的代码看起来像
<div class="wrap"> <img src=sites/all/themes/at_subtheme/css/img/header.jpg>
<div class="caption">
<div class="caption-inner">
<div class="caption-content">
<?php if ((( user_is_anonymous())) or (in_array('administrator', array_values($user->roles))) ) :?>
<h2 class="loginlink"> <a href="http://www.example.com">Login</h2></a><?php endif; ?>
<h2 class="mybackgroundtext">Mybackgroundtext</h2>
<img class="button"> <img src=sites/all/themes/at_subtheme/css/img/button.jpg>
<h2 class="headerposition">My headertext</h2>
<h6 class="subheaderposition">mysubheadertext</h6>
<h6 class="subsubheaderposition">Mysubsubheadertext</h6>
</div>
</div>
</div>
</div>
最佳答案
我不确定你到底想做什么。我只拿了你的按钮代码并制作了一个带有几个选项的 JSFIDDLE。谢谢，
<div class="caption">
<a target="_blank" title="Microsoft" class="btn btnImgContainer" href="http://www.microsoft.com/en- us/default.aspx">
<img class="myImage" src="http://c.s-microsoft.com/en-us/CMSImages/mslogo.png?version=856673f8-e6be-0476-6669-d5bf2300391d" />
</a>
<a target="_blank" class="btn btnContainer" href="#">Mybackgroundtext</a>
<a target="_blank" class="btn btnImgBackground" href="#">My Different Button</a>
</div>
.btn {
margin: 10px;
width: 200px;
height: 100%;
padding: 10px;
float: left;
text-align: center;
text-decoration: none;
}
.btn:hover {
padding-top: 15px;
text-decoration: underline;
}
.myImage {
width: 100%;
/*The height 100% distorts image*/
height: 100%;
}
.btnImgContainer {
width: 150px;
}
.btnContainer {
background: blue;
color: white;
}
.btnImgBackground {
background: url("http://www.psdgraphics.com/file/abstract-background.jpg");
background-size: 100%;
background-repeat: no-repeat;
color: white;
}
关于php - 以小背景显示文本，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/25726839/
相关文章：
php - InvalidArgumentException : The current node list is empty. PHP-Spider (DOMCrawler Symfony)
php - 谷歌语音 API "Sample rate in request does not match FLAC header"
javascript - 如何通过ajax函数发送数据到php文件？
CSS :not pseudo class is not taking effect
css - 带有 TinyMce 编辑器的 CakePHP : Numbered and bulleted lists not appearing in view. ctp