Tag: CSS

全屏幕响应背景图像: 我对前端开发和基础很陌生。我试图得到<div class="main-header">作为响应式缩放的全屏图像。谁能告诉我我做错了什么？它正确缩放，但没有显示完整的图像。我也希望在移动设备上放置<div class="large-6 large-offset-6 columns">是否有可能？ HTML： <!– MAIN HEADER –> <div class="main-header"> <div class="row"> <div class="large-6 large-offset-6 columns"> <h1 class="logo">BleepBleeps</h1> <h3>A family of little friends<br>that make parenting easier</h3> </div> <!– END large-6 large-offset-6 columns –> </div><!– END ROW –> </div><!– END MAIN-HEADER –> CSS： .main-header { background-image: url(../img/bb-background2.png); background-repeat: no-repeat; background-position: […]

HTML / CSS的字体颜色与跨度风格: 我应该使用什么？ <span style="color:red">test</span> 要么 <font color="red">test</font> 为什么？

如何去除围绕背景图像的灰色边框？: 我在下面这行代码中遇到了一个有趣的问题： <img style="background-image:url(Resources/bar.png); width: 300px; height: 50px;"/> 在Safari（至less）中，围绕300x50px区域的灰色边框。添加style =“border：none;” 不会删除它。有任何想法吗？谢谢。麦克风

我如何排列在同一行的3个div？: 有人可以帮助我解决这个问题，因为我一直在处理它很长一段时间…. 我试图让3个div在同一行旁边的其中一个div看起来像这样： <div> <h2 align="center">San Andreas: Multiplayer</h2> <div align="center"> <font size="+1"> <em class="heading_description">15 pence per slot</em> </font> <img src="http://fhers.comhttp://img.dovov.comgame_servers/sa-mp.jpg" class="alignleft noTopMargin" style="width: 188px; "> <a href="gfh" class="order-small"> <span>order</span></a> </div> 和另外两个是相同的divs请帮我把所有三个div在同一行上，右边一个在中间，一个在左边

css：避免图像hover第一次闪烁: 当有一个包含background-image的类class-btn ，我有一个锚点改变了它的背景background-image 。徘徊时，它已经 a.class-btn:hover { background-image('path/to/image-hovered.jpg'); } 第一次加载页面时，首次将该buttonhover时，该button会闪烁（下载保留的图像大约需要半秒钟的时间）。如何避免没有JavaScript的闪烁（只允许简单的CSS和HTML）？我试图search堆栈溢出的类似的问题，但没有运气。刚刚添加：我应该“预加载”hover的图像吗？怎么样？我应该玩Z指数还是不透明？它发生在所有的浏览器，因此该解决scheme应该适用于所有的浏览器。

为什么很多网站会缩小CSS和JavaScript，而不是HTML？: 可能重复：为什么要削减资产而不是标记？我看到很多网站使用缩小的CSS和JavaScript来增加网站响应时间，但我从来没有看到任何网站使用缩小的HTML。为什么你不希望你的HTML被缩小？

Bootstrap 3格没有差距: 我试图创build一个2列网格，字面上50％没有利润率或填充。我如何用Bootstrap 3实现这一点我试过这个，但在平板电脑/台式机断点处最终出现负边限： HTML <div class="container"> <div class="row"> <div class="col-sm-6 offset-0">Col 1</div> <div class="col-sm-6 offset-0">Col 2</div> </div> </diV> CSS .container { background: green; overflow: hidden; } .row > * { background: blue; color: #fff; } .row :first-child { background: red; } .offset-0 { padding-left: 0; padding-right: 0; } DEMO – http://jsfiddle.net/pjBzY/

文本旁边的品牌: 我如何将Bootstrap品牌和任何相关文字作为品牌一起对待？我试过这个： <nav class="navbar navbar-default"> <div class="navbar-header"> <div class="navbar-brand"> <a href="…" ><img class="img-responsive" src="/brand.png")?>"></a> <h3>Ultimate Trade Sizer</h3> </div> </div> </nav> 但是，我不能让他们alignment（即并排）。它产生以下效果：请注意，我正在使用Bootstrap 3。

带有Bootstrap的Google地图不响应: 我正在使用引导程序，并embedded了Google Maps API 3。 #map_canvas不响应; 这是一个固定的宽度。另外，如果我使用height: auto和width: auto地图不显示在页面中。为什么？ <style type="text/css"> body { padding-top: 60px; padding-bottom: 40px; } #map_canvas { height: 400px; width: auto; } </style> <div class="container"> <div class="row"> <div class="span6"> <div id="map_canvas"></div> </div> </div> </div>

HTML：我可以在多行显示button文字吗？: 我有一个像“点击这里开始播放”的长文本button。我想控制宽度和多行显示文本。是否可以在HTML / CSS？