程序设计 css

11

我想知道css3中是否支持侧面特定的内部阴影。我知道这在受支持的浏览器上效果很好。 div { box-shadow:inset 0px 1px 5px black; } 我只是想知道是否有一种方法可以实现以下目标： div { box-shadow-top:inset 0px 1px 5px black; }

80 css

10

将CSS应用于jQuery对话框按钮

因此，我目前有一个带有两个按钮的jQuery对话框：保存和关闭。我使用以下代码创建对话框： $dialogDiv.dialog({ autoOpen: false, modal: true, width: 600, resizable: false, buttons: { Cancel: function() { // Cancel code here }, 'Save': function() { // Save code here } }, close: function() { // Close code here (incidentally, same as Cancel code) } }); 但是，使用此代码时，两个按钮的颜色相同。我希望我的“取消”按钮与“保存”使用不同的颜色。有没有办法使用一些内置的jQuery选项来做到这一点？我从文档中没有得到太多帮助。请注意，我正在创建的“取消”按钮是预定义的类型，但是“保存”是我在定义自己。不知道这是否对这个问题有影响。任何帮助，将不胜感激。谢谢。更新：共识是这里有两条路可走：使用Firefox插件检查HTML firebug），并注意jQuery将jQuery应用于按钮的CSS类，并尝试重写它们。注意：在我的HTML中，两个按钮都使用了完全相同的CSS类，并且没有唯一的ID，因此没有此选项。在对话框打开时使用jQuery选择器来捕获我想要的按钮，然后向其添加CSS类。 …

80 jquery css jquery-ui button dialog

8

CSS单行或多行垂直对齐

我的标题可以包含一行或多行。如何垂直对齐文本？如果总是一行，我可以将line-height设置为容器的高度。我可以使用JavaScript来做到这一点，但是我真的不喜欢它，我正在寻找一种纯CSS方式。另外，如果容器可以用线条扩展，那将是完美的，因此我始终可以在顶部和底部使用相同的填充。

80 html css

12

有什么方法可以使字段集的宽度仅与控件中的控件一样宽？

似乎fieldset默认为其容器的100％宽度。有什么方法可以使字段集与字段集中的最大控件一样大？

80 html css fieldset

2

如何防止内联块div包装？

jsFiddle演示我希望divs：包装内容。停留在其原始关联行中，基本上无需包装。基本上，当它们无法显示在屏幕上时，它们彼此堆叠在一起。我希望它们在屏幕外隐藏。我尝试添加overflow: hidden;主布局样式。我不想为每个固定宽度div。它需要适合内容。 .layout { -moz-border-radius: 15px; border-radius: 15px; vertical-align: top; display: inline-block; } .layoutbacking { -moz-border-radius: 15px; border-radius: 15px; padding: 5px; margin: 5px; background: #CCCCCC; } <div class="layout" style="background: #222222; width: 100%"> <div> <div class="layout layoutbacking"> <table> <tr> <th>header 1</th> <th>header 2</th> <th>header 3</th> <th>header …

80 html css layout

13

我应该如何组织CSS文件的内容？

这个问题是关于在.css文件中组织实际的CSS指令本身。在开发一个新页面或一组页面时，通常只将手工指令添加到.css文件中，尝试在可能的时候进行重构。一段时间后，我有几百（或几千）行，调整布局时很难找到所需的内容。有人对如何组织指令有建议吗？我是否应该尝试自上而下地模仿DOM？我是否应该在功能上进行组织，将支持UI相同部分的元素的指令放在一起？我应该按选择器按字母顺序对所有内容排序吗？这些方法的某种组合？此外，在将一个文件拆分成多个单独的文件之前，我应该在一个文件中保留多少CSS是否有限制？说1000行吗？还是将整个事情放在一个地方总是一个好主意？相关问题：组织CSS规则的最佳方法是什么？

80 css

12

使html文本输入字段随着我键入而增长？

我可以在CSS中设置初始文本输入大小，如下所示： width: 50px; 但是我希望它在输入时会不断增长，直到达到200px。可以直接在CSS，HTML中完成此操作，最好在没有JavaScript的情况下进行此操作吗？当然也发布您的js / jquery解决方案，但是如果没有它们也是可行的-那太好了。我在这里尝试： http://jsfiddle.net/jszjz/2/

80 javascript jquery html css

6

IE删除伪元素CSS？

我一直在尝试让一些伪元素在IE上工作，但它不允许我这样做。它越过CSS并表现出它不存在的状态，这有点使我难过。有人知道我在做什么错吗？ .newbutton { border-radius: 50%; width: 74px; height: 74px; position: relative; background-color: black; margin: 60px 0px 25px 17px; overflow: visible; } .newbutton:before { content: "f"; width: 80px; height: 80px; position: absolute; border-radius: 50%; z-index: -1; top: 37px; left: 37px; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-animation-name: fadecolor; -webkit-animation-duration: …

80 css internet-explorer ie-developer-tools

1

CSS像素可以算小数吗？

CSSpx可以算是零头吗？标准允许吗？如果可以，主流浏览器是否支持它？伙计们，让我们用文档来备份答案。

80 css w3c

4

为什么需要translateY（-50％）来使位于顶部的元素居中：50％？

我可以看到这段代码可以使div在其父元素内垂直对齐： .element { position: relative; top: 50%; transform: translateY(-50%); } 问题是为什么？我首先想到的是父元素所包含的内容不只是视口。我将父视口设置为高度100vh和宽度相等100%。那没有用。我仍然需要平移或负边距补偿。当父元素设置为时，为什么需要负偏移量margin: 0;？是因为我没有考虑到计算利润率吗？

80 html css

7

在引导程序中将列固定位置

使用Bootstrap，我有一个网格列class =“ col-lg-3”，我想将其放置在position：fixed，而另一个.col-lg-9是正常位置（可滚动浏览整个页面）。 <div class="row"> <div class="col-lg-3"> Fixed content </div> <div class="col-lg-9"> Normal scrollable content </div> </div> 就像LifeHacker.com中的左列一样，您将看到左侧部分固定，但是我在页面上滚动。我使用bootstrap v3.1.1

80 css twitter-bootstrap twitter-bootstrap-3

2

为什么媒体查询的顺序在CSS中很重要？

最近，我一直在设计响应速度更快的网站，并且经常使用CSS媒体查询。我注意到的一种模式实际上是定义媒体查询的顺序。我没有在每个浏览器中都进行过测试，只是在Chrome上进行了测试。有这种行为的解释吗？有时，当您的网站无法正常工作时，它会令人沮丧，并且您不确定是查询还是编写查询的顺序。这是一个例子：的HTML <body> <div class="one"><h1>Welcome to my website</h1></div> <div class="two"><a href="#">Contact us</a></div> </body> CSS： body{ font-size:1em; /* 16px */ } .two{margin-top:2em;} /* Media Queries */ @media (max-width: 480px) { .body{font-size: 0.938em;} } /* iphone */ @media only screen and (-webkit-min-device-pixel-ratio: 2) { body {font-size: 0.938em;} } /*if greater than …

80 css media-queries responsive-design

10

从Bot隐藏电子邮件地址-保留mailto：

tl; dr 在不使用脚本的情况下从漫游器隐藏电子邮件地址并维护mailto:功能。方法还必须支持屏幕阅读器。概要电子邮件混淆，无需使用脚本或联系表格电子邮件地址必须对观众完全可见，并保持mailto:功能电子邮件地址不能为图像形式。电子邮件地址必须对垃圾邮件抓取者和垃圾邮件机器人以及任何其他收割者类型“完全”隐藏所需效果：请没有脚本。项目中没有使用脚本，我想保持这样。电子邮件地址可以显示在页面上，也可以在用户进行某种形式的交互后轻松显示，例如打开模式。该用户可以点击的电子邮件地址，这反过来会触发mailto:功能。单击电子邮件将打开用户的电子邮件应用程序。换句话说，mailto:功能必须起作用。电子邮件地址不可见或未标识为机器人的电子邮件地址（包括页面源）我的收件箱里没有垃圾邮件什么不工作添加联系表格-或类似内容-代替电子邮件地址我讨厌联络表格。我很少填写联系表格。如果没有电子邮件地址，我会寻找电话号码，如果没有电话号码，我会开始寻找替代服务。如果绝对需要，我只会填写联系表格。用地址图像替换地址这会对使用屏幕阅读器的人造成巨大的不利影响（请记住，您未来的项目中有视力障碍的人）除非您使图像可单击，然后再将该功能添加为链接的，否则它还会删除该mailto:功能，但这违背了目的，并且现在僵尸程序可以看到该电子邮件。mailto:href 可能有效的方法：巧妙地使用pseudo-elementsinCSS 利用base64编码的解决方案分解电子邮件地址并在文档中散布各个部分，然后在用户单击按钮时将它们放回模态中（这可能涉及多个CSS类和的用法anchor tags） html通过更改属性CSS @MortezaAsadi在下面的评论中优雅地提出了可能性。这是完整链接-该文章来自2012年：如果我们可以使用CSS更改HTML属性怎么办？我所不了解的其他创造性解决方案。类似的问题/修复 JavaScript：Joe Maller保护您的电子邮件地址（这是乔·马勒（Joe Maller）提出的一个很好的解决方案，它可以很好地工作，但是它是基于脚本的。 <SCRIPT TYPE="text/javascript"> emailE = 'emailserver.com' emailE = ('yourname' + '@' + emailE) document.write('<A href="mailto:' …

80 html css web-crawler mailto

5

如何使用HTML / CSS UI构建本机C ++应用程序？

使用HTML和CSS作为用户界面时是否可以开发C ++程序？我了解使用Webkit容器使用Javascript进行编程的知识，但是我对C ++开发确实很感兴趣。当我在Windows下开发时，我感到爱上C＃WPF，但是现在我转而使用Linux，但找不到用于将标记用于接口的好工具。为此，我想将HTML和CSS（它们非常轻巧且易于使用）与C ++代码和WPF等混合使用。哦，还有一件事：我在寻找桌面开发而不是网络。

80 c++ html css user-interface desktop-application

5

将两个班级分配给一个div时，班级否决

我正在创建一个<div>标签，在该标签中，我想为<div>标签应用两个类，这将是一个缩略图库。一类代表其位置，另一类代表其风格。这样我可以应用样式，结果有些奇怪，这使我产生了疑问。可以给<div>标签分配两个类别吗？如果是这样，哪一个优先于另一个？或者哪个优先？

80 class css html

Questions tagged «css»