Questions tagged «css»

我想要一个包含一个中心词的网页。 我希望用动画来绘制该单词，以便页面以与我们相同的方式“写”出该单词，即，它从一个点开始并随时间绘制线条和曲线，从而最终结果是一个字形。 我不在乎这是使用<canvas>DOM还是DOM 完成，也不关心它是使用JavaScript还是CSS完成的。缺少jQuery会很好，但不是必需的。 我怎样才能做到这一点？我进行了详尽的搜索，没有运气。

229 javascript  css  canvas  html5-canvas  css-shapes 

有没有一种方法可以在比其父对象更宽的父容器DIV中包含子DIV。子DIV必须与浏览器视口的宽度相同。 请参见下面的示例： 子DIV 必须保留为父div的子。我知道我可以在子div上设置任意的负边距以使其更宽，但是我不知道如何从根本上使它成为浏览器宽度的100％。 我知道我可以这样做： .child-div{ margin-left: -100px; margin-right: -100px; } 但是我需要孩子的宽度与动态浏览器的宽度相同。 更新资料 感谢您的回答，到目前为止，似乎最接近的答案是将子DIV位置设置为绝对位置，并将left和right属性设置为0。 我遇到的下一个问题是父级具有position：relative，这意味着left和right属性仍然相对于父级div而不是浏览器，请参见此处的示例：jsfiddle.net/v2Tja/2 如果不搞砸其他事情，我就不能从父母那里删除相对位置。

229 css  html 

我到处都读到CSS不区分大小写，但是我有这个选择器 .holiday-type.Selfcatering 当我像这样在HTML中使用时，它会被拾取 <div class="holiday-type Selfcatering"> 如果我这样改变上面的选择器 .holiday-type.SelfCatering 这样就不会拾取样式。 有人在说谎。

229 html  css  css-selectors 

我正在尝试通过查看其代码来复制我进入gmail的邮件程序。我在多个源代码查看器中看到了很多： <td style=3D"border-bottom: 1px dotted rgb(153,157, 147); border-top: 1px solid rgb(28, 140, 78);" width=3D"90">=A0</td> <td style=3D"border-bottom: 1px dotted rgb(153,157, 147); border-top: 1px solid rgb(28, 140, 78);" align=3D"right" width=3D"110"> 3D是否是我不知道的某种邮件渲染方式？

229 html  css  html-email 

可以将.css文件导入.less文件...吗？ 我对较少的内容非常熟悉，并将其用于我的所有开发。我经常使用如下结构： @import "normalize"; //styles here @import "mixins"; @import "media-queries"; @import "print"; 所有导入文件都是其他.less文件，并且可以正常运行。 我当前的问题是：我想将.css文件导入.less，以引用.css文件中使用的样式，如下所示： @import "../style.css"; .small { font-size:60%; .type; } // other styles here .css文件包含一个名为的类，.type但是当我尝试编译.less文件时，出现错误NameError: .type is undefined .less文件不会仅导入其他.less文件...吗？还是我引用错了...？！

228 css  import  less 

我正在使用新的Twitter Bootstrap创建网站。该网站看起来不错，并且可以在除IE8之外的所有必需浏览器中使用。 在IE8中，它似乎在显示移动版本的元素，但延伸到了桌面的全屏。我相信我遇到的问题是Twitter引导程序首先是移动设备。因此出于某些原因，IE8会选择此选项。 我还注意到，container该类似乎并未按预期引入max-width CSS属性。谁能看到我做错了什么？ <!-- Favicon --> <link rel="shortcut icon" href="/favicon.ico"> <link rel="apple-touch-icon" href="/apple-touch-icon.png"> <!-- Bootstrap --> <link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0-rc1/css/bootstrap.css" rel="stylesheet"> <link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.min.css" rel="stylesheet"> <script src="/SiteFiles/js/modernizr.js"></script> <!-- CSS --> <link href="/SiteFiles/css/main.css" rel="stylesheet"> <header> <div class="topArea clearfix"> <div class="container"> <div class="topLinks"> <div class="btn-group"> <span class="flag" data-toggle="dropdown"> </span> <ul class="dropdown-menu"> <li><a href="#">Country 1</a></li> …

228 html  css  twitter-bootstrap  internet-explorer-8  twitter-bootstrap-3 

我visibility:hidden用来隐藏某些元素，但隐藏时它们仍会占用页面上的空间。 我如何才能使它们在视觉上完全消失，就像它们根本不在DOM中一样（但实际上没有从DOM中删除它们）？

228 html  css 

任何方法都可以在左右两侧（水平？）获得箱形阴影，而没有任何骇客或图像。我在用： box-shadow: 0 0 15px 5px rgba(31, 73, 125, 0.8); 但它给周围的阴影。 我周围没有边界。

228 html  css 

我正在创建一个带有DIV的网站。一切正常，除了创建DIV时。我这样创建它们（示例）： newdiv { width: 200px; height: 60px; padding-left: 20px; text-align: left; } 当我添加该padding-left属性时，DIV更改的宽度更改为220px，并且我希望它保持在200px。 假设我创建了另一个与完全相同的DIV名称，然后将其放在其中，但没有填充且具有。我得到同样的东西，其宽度将为220px。anotherdivnewdivnewdivnewdivanotherdivpadding-left: 20pxnewdiv 我该如何解决这个问题？

227 html  css  padding 

我正在使用jQuery和jQuery-ui，并希望为各种对象设置各种属性的动画。 为了在此说明问题，我将其简化为一个div，当用户将鼠标悬停在该div时，该颜色从蓝色变为红色。 使用时我可以得到想要的行为animate()，但是这样做时，我要设置动画的样式必须在动画代码中，因此与样式表是分开的。（请参见示例1） 一种替代方法是使用addClass()，removeClass()但是我无法重新创建可以得到的确切行为animate()。（请参见示例2） 例子1 让我们看一下我拥有的代码animate()： $('#someDiv') .mouseover(function(){ $(this).stop().animate( {backgroundColor:'blue'}, {duration:500}); }) .mouseout(function(){ $(this).stop().animate( {backgroundColor:'red'}, {duration:500}); }); 它显示了我正在寻找的所有行为： 在红色和蓝色之间平滑地动画。 当用户将鼠标快速移入或移出div时，没有动画“超排队”。 如果用户在动画播放过程中将鼠标移入/移出，则可以正确地缓解当前的“中途”状态和新的“目标”状态。 但是，由于定义了样式更改，因此animate()我必须在此处更改样式值，而不能仅将其指向我的样式表。样式定义的这种“碎片化”确实让我感到困扰。 例子2 这是我目前使用addClass()和的最佳尝试removeClass（请注意，要使动画正常工作，您需要jQuery-ui）： //assume classes 'red' and 'blue' are defined $('#someDiv') .addClass('blue') .mouseover(function(){ $(this).stop(true,false).removeAttr('style').addClass('red', {duration:500}); }) .mouseout(function(){ $(this).stop(true,false).removeAttr('style').removeClass('red', {duration:500}); }); 这同时显示了我的原始要求的属性1.和2.，但是3不起作用。 我了解原因： 当动画addClass()和removeClass() jQuery将临时样式添加到元素，然后递增适当的值，直到它们达到所提供类的值，然后才实际添加/删除该类。 因此，我必须删除样式属性，否则，如果动画停止一半，样式属性将保留并永久覆盖任何类值，因为标记中的样式属性比类样式具有更高的重要性。 但是，当动画完成一半时，它还没有添加新类，因此，使用此解决方案，当用户在动画完成之前移动鼠标时，颜色会跳到先前的颜色。 我理想地想要做的是这样的事情： $('#someDiv') .mouseover(function(){ …

225 javascript  jquery  css  jquery-ui  jquery-animate 

单击按钮后，所有按钮周围都有高亮显示。这是在Chrome中。 <button class="btn btn-primary btn-block"> <span class="icon-plus"></span> Add Page </button> 我正在使用带有主题的Bootstrap，但我敢肯定不是这样：我之前在另一个项目中注意到这一点。 如果我使用<a>标记代替，它将消失<button>。为什么？如果我想使用<button>该如何使它消失？

225 html  css  twitter-bootstrap 

可以使用以下样式设置文本输入的占位符： -webkit-input-placeholder { color: red; } 我正在在线寻找一个网站，我希望使用与它们相同的占位符颜色。有可能弄清楚他们使用什么颜色？我想包含任何alpha值，所以我不能只使用图像编辑器对颜色进行采样。 当我使用Chrome开发工具检查元素时，看到： 在检查输入元素时，开发工具不会提供有关占位符元素的信息。还有另一种方法吗？

225 html  css 

我在进行CSS设计时一直想知道的东西。 是否遵守CSS宽度的小数位？还是四舍五入？ .percentage { width: 49.5%; } 要么 .pixel { width: 122.5px; }

225 html  css 

我使用此代码右对齐按钮。 <p align="right"> <input type="button" value="Click Me" /> </p> 运行代码段隐藏结果展开摘要 但是<p>标签会浪费一些空间，因此希望使用<span>或进行相同的操作<div>。

225 html  css 

我有这个@media设置： HTML： <head> <meta name="viewport" content="width=device-width, user-scalable=no" /> </head> CSS： @media screen and (min-width: 769px) { /* STYLES HERE */ } @media screen and (min-device-width: 481px) and (max-device-width: 768px) { /* STYLES HERE */ } @media only screen and (max-device-width: 480px) { /* STYLES HERE */ } 通过此设置，它可以在iPhone上运行，但不能在浏览器中运行。 是因为我已经device在meta中，也许已经在max-width:480px？

225 css  mobile  media-queries