程序设计 css

10

我有 body { background: url(images/background.svg); } 所需的效果是此背景图像的宽度将等于页面的宽度，并更改高度以保持比例。例如，如果原始图像恰好是100 * 200（任意单位），并且主体是600px宽，则背景图像最终应该是1200px高。如果调整窗口大小，则高度应自动更改。这可能吗？目前，Firefox看起来像是调整高度，然后调整宽度。这可能是因为高度是最长的尺寸，并且它正在尝试避免裁切吗？我想垂直裁剪，然后滚动：无水平重复。此外，Chrome会将图像放置在中间，即使重复显示，也不会重复background-repeat:repeat，这仍然是默认设置。

365 html css

5

如何将工具提示添加到span元素？

在下面的代码中，我希望用户悬停跨度时出现工具提示，该怎么办？我不想使用任何链接。 <span> text </span>

364 html css

16

禁用/启用按钮和链接的最简单方法是什么（jQuery + Bootstrap）

有时我使用样式设置为按钮的锚，有时我仅使用按钮。我想禁用特定的clicky-thing，以便：他们看起来很残疾他们不再被点击我怎样才能做到这一点？

360 jquery html css twitter-bootstrap

3

根据多个类别选择元素

我有一个样式规则，当它有两个类时，我想将其应用于标签。没有JavaScript，有什么方法可以执行此操作吗？换一种说法： <li class='left ui-class-selector'> 我想申请我的样式规则仅如果li有两个.left及.ui-class-selector类应用。

360 css css-selectors

22

如何设置字体真棒图标的图标颜色，大小和阴影样式

如何从Font Awesome的图标中设置图标的颜色，大小和阴影？例如，Font Awesome的网站将以白色显示一些图标，以红色显示一些图标，但不会显示CSS如何以这种方式设置样式...

358 css twitter-bootstrap icons styles font-awesome-4

10

如何在Github上将HTML页面视为正常的呈现HTML页面，以在浏览器中预览预览而无需下载？

在http://github.com上，开发人员保留项目的HTML，CSS，JavaScript和图像文件。如何在浏览器中看到HTML输出？例如：https : //github.com/necolas/css3-social-signin-buttons/blob/master/index.html 当我打开它时，它不会显示作者代码的呈现HTML。它将页面显示为源代码。是否可以直接将其视为呈现的HTML？否则，我总是需要下载整个ZIP文件才能查看结果。

355 html css git github github-pages

12

如何居中浮动元素？

我正在实现分页，它需要居中。问题在于链接需要显示为块，因此它们需要浮动。但是，那text-align: center;对它们不起作用。我可以通过给左边的wrapper div填充来实现，但是每个页面都有不同数量的页面，所以这是行不通的。这是我的代码： .pagination { text-align: center; } .pagination a { display: block; width: 30px; height: 30px; float: left; margin-left: 3px; background: url(/images/structure/pagination-button.png); } .pagination a.last { width: 90px; background: url(/images/structure/pagination-button-last.png); } .pagination a.first { width: 60px; background: url(/images/structure/pagination-button-first.png); } <div class='pagination'> <a class='first' href='#'>First</a> <a href='#'>1</a> <a href='#'>2</a> <a …

354 css-float center css

12

如何正确对齐div元素？

我的html文档的正文包含3个元素，一个按钮，一个表单和一个画布。我希望按钮和表单右对齐，而画布保持左对齐。问题是当我尝试对齐前两个元素时，它们不再彼此跟随而是在水平方向上彼此相邻？，这是我到目前为止的代码，我希望表格紧跟在右边的按钮之后中间没有空格。 #cTask { background-color: lightgreen; } #button { position: relative; float: right; } #addEventForm { position: relative; float: right; border: 2px solid #003B62; font-family: verdana; background-color: #B5CFE0; padding-left: 10px; } <!DOCTYPE html> <html lang="en"> <head> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js"></script> <script type="text/javascript" src="timeline.js"></script> <link rel="stylesheet" href="master.css" type="text/css" media="screen" /> </head> <body bgcolor="000" …

350 css html

6

如何为a：before和a：after编写：hover条件？

如何写:hover和:visited条件a:before？我正在尝试，a:before:hover但是没有用

346 css css-selectors pseudo-element pseudo-class

30

打开模式时防止BODY滚动

当我的网站上的Modal（来自http://twitter.github.com/bootstrap）打开时，我希望我的身体在使用鼠标滚轮时停止滚动。我试图在模式打开时调用下面的一段javascript，但没有成功 $(window).scroll(function() { return false; }); 和 $(window).live('scroll', function() { return false; }); 请注意，我们的网站已放弃了对IE6的支持，不过IE7 +需要兼容。

346 javascript jquery css scroll

27

如何向ReactJS组件添加多个类

我是ReactJS和JSX的新手，下面的代码有一些问题。我试图将多个类添加到className每个属性li： <li key={index} className={activeClass, data.class, "main-class"}></li> 我的React组件是： var AccountMainMenu = React.createClass({ getInitialState: function() { return { focused: 0 }; }, clicked: function(index) { this.setState({ focused: index }); }, render: function() { var self = this; var accountMenuData = [ { name: "My Account", icon: "icon-account" }, { name: "Messages", …

345 javascript css reactjs ecmascript-6

9

如何使文本输入不可编辑？

所以我有文字输入 <input type="text" value="3" class="field left"> 这是我的CSS background:url("images/number-bg.png") no-repeat scroll 0 0 transparent; border:0 none; color:#FFFFFF; height:17px; margin:0 13px 0 0; text-align:center; width:17px; 是否有设置或技巧，我当时在考虑制作标签，但样式如何。我该如何转换它们？有没有更好的方法？还是那是唯一的方法？

344 html css html-input

16

如何更改svg元素的颜色？

我想使用这项技术http://css-tricks.com/svg-fallbacks/并更改svg颜色，但到目前为止我还没有做到这一点。我把它放在css中，但是无论如何我的图像总是黑色的。我的代码： .change-my-color { fill: green; } <svg> <image class="change-my-color" xlink:href="https://svgur.com/i/AFM.svg" width="96" height="96" src="ppngfallback.png" /> </svg> 运行代码段隐藏结果展开摘要

344 css svg

26

从Bootstrap 3的列中删除填充

问题：删除Bootstrap 3中col-md- *左右的填充/边距。 HTML代码： <div class="col-md-12"> <h2>OntoExplorer<span style="color:#b92429">.</span></h2> <div class="col-md-4"> <div class="widget"> <div class="widget-header"> <h3>Dimensions</h3> </div> <div class="widget-content" id=""> <div id='jqxWidget'> <div style="clear:both;margin-bottom:20px;" id="listBoxA"></div> <div style="clear:both;" id="listBoxB"></div> </div> </div> </div> </div> <div class="col-md-8"> <div class="widget"> <div class="widget-header"> <h3>Results</h3> </div> <div class="widget-content"> <div id="map_canvas" style="height: 362px;"></div> </div> </div> </div> </div> …

342 css twitter-bootstrap html

29

CSS中的自适应字体大小

我已经使用Zurb Foundation 3网格创建了一个站点。每个页面都有一个大的h1： body { font-size: 100% } /* Headers */ h1 { font-size: 6.2em; font-weight: 500; } <div class="row"> <div class="twelve columns text-center"> <h1> LARGE HEADER TAGLINE </h1> </div>  </div>  运行代码段隐藏结果展开摘要当我将浏览器调整为移动大小时，大字体不会调整，并导致浏览器包含水平滚动条以适应大文本。我注意到在Zurb Foundation 3 Typography 示例页面上，标题在压缩和扩展时适应浏览器。我是否真的缺少明显的东西？我该如何实现？

341 css responsive-design font-size zurb-foundation em

Questions tagged «css»