Questions tagged «css»

CSS（层叠样式表）是一种表示样式表语言，用于描述HTML（超文本标记语言），XML（可扩展标记语言）文档和SVG元素的外观和格式，包括（但不限于）颜色，布局，字体，和动画。它还描述了如何在屏幕，纸张，语音或其他媒体上呈现元素。

11
如何降低CSS中的图像亮度
我想降低CSS中的图像亮度。我进行了很多搜索，但所能获得的只是关于如何更改不透明度的信息，但这会使图像更明亮。谁能帮我 ？
105 css 
2
除第一个孩子和最后一个孩子外的CSS选择器
我正在制作一个非常高级的网站。我的问题：是否可以选择除:first-child和以外的所有其他子代:last-child？我知道有一个:not()选择器，但是不能与多个选择器一起使用，而不放在括号中。这就是我所拥有的： #navigation ul li:not(:first-child, :last-child) { background: url(images/UISegmentBarButtonmiddle@2x.png); background-size: contain; }
105 html  css  css-selectors 
4
使用CSS在div底部对齐按钮
我想将按钮对准div的右下角。我怎样才能做到这一点？ 当前div的CSS： float: right; width: 83%; margin-right: 0px; font-family: Arial, Helvetica, sans-serif; font-size: 12px; height:625px; overflow:auto;
105 css  button  alignment 
10
fancybox2 / fancybox导致页面跳到顶部
我已经在开发站点上实现了fancybox2。 当我使用fancybox时（单击链接等），整个html都移到了它的后面-然后转到顶部。我在另一个演示中可以正常工作，但是当我将相同的代码拖到该项目中时，它将跳到顶部。不仅包含指向内嵌div的链接，而且还包含简单的图片库。 有人经历过吗？
105 jquery  css  fancybox-2 
6
载入后如何使用JavaScript调整Google Map的大小？
我将“ mapwrap” div设置为400px x 400px，在其中，我将Google“地图”设置为100％x 100％。因此，地图加载为400 x 400像素，然后使用JavaScript将“ mapwrap”的大小调整为屏幕的100％x 100％-google地图按照我的预期将大小调整为整个屏幕，但图块在其右边缘之前开始消失页。 我可以调用一个简单的函数来使Google地图重新调整为较大尺寸的“ mapwrap” div吗？
4
<输入类型=“？”的CSS选择器
CSS是否可以根据类型将所有输入作为目标？我有一个禁用类，可以在各种禁用表单元素上使用，并且我正在设置文本框的背景色，但是我不希望我的复选框获得该颜色。 我知道我可以使用单独的类来做到这一点，但如果可能的话，我宁愿使用CSS。我敢肯定，我可以在javascript中设置它，但是再次寻找CSS。 我的目标是IE7 +。所以我认为我不能使用CSS3。 编辑 使用CSS3，我可以做类似的事情吗？ INPUT[type='text']:disabled 甚至完全摆脱我的课... 编辑 好的，谢谢您的帮助！因此，这是一个选择器，它可以修改所有禁用的文本框和区域，而无需设置任何类，当我开始这个问题时，我从未想到这是可能的... INPUT[disabled][type='text'], TEXTAREA[disabled] { background-color: Silver; } 这在IE7中有效
3
使用chart.js v2删除图表上的图例
我正在使用Bootstrap，JQuery和Chart.js（v2）制作主页。我使用v1实现了我的实现，但是最近刚进入Bower并使用该版本下载了v2。 我正在制作一个由4列组成的网格，每个网格包含一个饼图，但是v2中的缩放比例使我无法正常工作。我希望图表能够响应，以便它们可以在较小的设备（如平板电脑和智能手机）上正确缩放，而我的问题之一是摆脱了图表图例以及将鼠标悬停在我的各部分上时的悬停信息图表。 index.html &lt;body&gt; &lt;div class="container"&gt; &lt;div class="row"&gt; &lt;div class="col-xs-3"&gt; &lt;canvas id="chart1"&gt;&lt;/canvas&gt; &lt;/div&gt; &lt;div class="col-xs-3"&gt; &lt;canvas id="chart1"&gt;&lt;/canvas&gt; &lt;/div&gt; &lt;div class="col-xs-3"&gt; &lt;canvas id="chart1"&gt;&lt;/canvas&gt; &lt;/div&gt; &lt;div class="col-xs-3"&gt; &lt;canvas id="chart1"&gt;&lt;/canvas&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/body&gt; functions.js $(document).ready(function(){ var canvas = $("#chart1"); var data = { labels: [], datasets: [{ data: [10, 10], backgroundColor: ["#F7464A", …
12
仅使用CSS在HTML元素之间添加空间
我有几个相同的HTML元素相继出现： &lt;span&gt;1&lt;/span&gt; &lt;span&gt;2&lt;/span&gt; &lt;span&gt;3&lt;/span&gt; 我正在寻找仅使用CSS在元素之间添加空间的最佳方法 [no space] [1] [space 10px] [2] [space 10px] [3] [no space] 另外： 请写下您收据的浏览器兼容性 更新 看来我不清楚。我不想使用任何其他HTML标记，例如 &lt;span&gt;&lt;/span&gt; &lt;span&gt;&lt;/span&gt; &lt;span class="last_span"&gt;&lt;/span&gt; 我不想用桌子 我希望CSS可以自动定位第一个和最后一个跨度 我不想使用JavaScript 可选要求：last span可以不是父标记的LAST LAST LD，但是它将是父标记的LAST SPAN。跨度之间没有任何其他标签。
105 css  layout  receipt 
6
左溢而不是右溢
我有一个div overflow:hidden，其中在用户键入时显示电话号码。div内的文本向右对齐，并且随着文本向左增加，传入的字符被添加到右边。 但是，一旦文本足够大而无法放入div中，该数字的最后一个字符将自动被裁剪，用户将看不到她键入的新字符。 我想做的是裁剪左边的字符，就像div显示的是最右边的内容并溢出到左侧。如何产生这种效果？
105 css  html  overflow 
10
列出用户浏览器可以显示的每种字体
javascript中是否有办法获取浏览器可以显示的所有字体（或字体家族）的名称？（我想为用户提供一个包含所有可用字体的列表的下拉列表，并允许用户选择一种字体。）我不希望不必事先对该列表进行硬编码或从服务器发送下来。（直觉上，似乎浏览器应该知道它拥有什么字体，并且应该以某种方式将其公开给javascript。）
105 javascript  css  browser  fonts 
5
我的位置：使用flexbox时，粘性元素不粘性
我对此稍作停留，以为我会分享这个position: sticky+ flexbox陷阱： 在将视图切换到Flex Box容器之前，我的粘性div工作正常，并且当将div包裹在flexbox父级中时，div突然变得不粘性。 .flexbox-wrapper { display: flex; height: 600px; } .regular { background-color: blue; } .sticky { position: -webkit-sticky; position: sticky; top: 0; background-color: red; } &lt;div class="flexbox-wrapper"&gt; &lt;div class="regular"&gt; This is the regular box &lt;/div&gt; &lt;div class="sticky"&gt; This is the sticky box &lt;/div&gt; &lt;/div&gt; 运行代码段隐藏结果展开摘要 JSFiddle显示问题
2
将最后一个伸缩项目放置在容器的末尾
这个问题涉及具有完全css3支持（包括flexbox）的浏览器。 我有一个Flex容器，里面有一些物品。他们都被认为可以灵活启动，但是我希望最后一个 .end项目可以被灵活终止。有没有一种好的方法，而无需修改HTML且不求助于绝对定位？ .container { display: flex; flex-direction: column; outline: 1px solid green; min-height: 400px; width: 100px; justify-content: flex-start; } p { height: 50px; background-color: blue; margin: 5px; } &lt;div class="container"&gt; &lt;p&gt;&lt;/p&gt; &lt;p&gt;&lt;/p&gt; &lt;p&gt;&lt;/p&gt; &lt;p class="end"&gt;&lt;/p&gt; &lt;/div&gt; 运行代码段隐藏结果展开摘要
105 css  flexbox 
5
text-overflow：Firefox 4中的省略号？（和FF5）
该text-overflow:ellipsis;CSS属性必须的几件事情，微软公司已经做了正确的网络之一。 现在，所有其他浏览器都支持它...除了Firefox。 自2005年以来，Firefox开发人员一直在争论它，但是尽管有明显的需求，但他们似乎并不能真正实现它（即使是实验性的-moz-实现也足够了）。 几年前，有人想出了一种方法来破解Firefox 3，使其支持省略号。黑客使用该-moz-binding功能通过XUL实施该功能。现在有很多站点都在使用此hack。 坏消息？Firefox 4正在删除该-moz-binding功能，这意味着该黑客将不再起作用。 因此，一旦Firefox 4发布（我听说本月下旬），我们将回到无法支持此功能的问题。 所以我的问题是：还有其他解决方法吗？（我试图尽可能避免使用Javascript解决方案） [编辑] 很多赞成票，所以我显然不是唯一想知道的人，但是到目前为止，我只有一个答案，基本上是说“使用javascript”。我仍然希望找到一种根本不需要JS的解决方案，或者最糟糕的情况是仅将其用作CSS功能无法使用的后备解决方案。因此，我将悬赏该问题，以免某个地方有人找到答案。 [编辑] 更新：Firefox进入了快速开发模式，但是尽管现在发布了FF5，仍然不支持此功能。现在，大多数用户都已从FF3.6升级，该黑客不再是解决方案。有人告诉我好消息，它可能会添加到Firefox 6中，而新版本的发布时间表应该会在短短几个月内发布。如果是这样，那么我想我可以等一下，但是他们不能尽快对它进行分类很可惜。 [最终编辑] 我看到省略号功能终于被添加到了Firefox的“ Aurora Channel”（即开发版本）中。这意味着它现在应该作为Firefox 7的一部分发布，该版本将于2011年底发布。真是令人欣慰。 发行说明可在此处获得：https : //developer.mozilla.org/en-US/Firefox/Releases/7
104 firefox  ellipsis  css 
4
CSS显示：表格最小高度不起作用
有谁知道我可以使最新的浏览器达到最小高度？我正在使用CSS表，它似乎忽略了最小高度。 &lt;div style="background-color: red; display: table; min-height: 100px;"&gt; abc &lt;/div&gt; 小提琴
104 css 
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.