我敢肯定以前必须提到/问过,但一直在寻找没有运气的年龄,我的术语一定是错的!
我依稀记得我刚才看到的一条推文,它提示有一条css规则可以删除以前在样式表中为特定元素设置的任何样式.
一个很好的使用示例可能是在移动优先的RWD站点中,其中用于小屏幕视图中的特定元素的大部分样式需要"重置"或移除桌面视图中的相同元素.
一个css规则,可以实现如下:
.element {
all: none;
}
用法示例:
/* mobile first */
.element {
margin: 0 10;
transform: translate3d(0, 0, 0);
z-index: 50;
display: block;
etc..
etc..
}
@media only screen and (min-width: 980px) {
.element {
all: none;
}
}
因此,我们可以快速删除或重新设置样式,而无需声明每个属性.
说得通？
我在哪里可以找到浏览器的HTML元素的默认CSS？
许多HTML元素都带有一些默认的CSS属性,这些属性有时会导致未知/不需要的行为.例如,输入框在不同浏览器中的显示方式不同.我正在寻找一个涵盖新CSS3属性和新HTML5元素的地方.
我已经在其他(更老的)问题(例如浏览器的默认CSS样式表)中看到了答案,这些答案提示了CSS重置的解决方案.这个解决方案有时候不需要,我常常想保留一些基本属性(例如Chrome中输入框的突出显示).换句话说:我不想因为我不知道他们做了什么而摆脱了.
那么,是否有一个网站可以提供所有这些信息(或者可能是大多数)？
我正在创建一个包含不同颜色(href链接)的单词的导航菜单.我希望颜色不要在任何状态下改变(悬停,访问等).
我知道如何设置不同状态的颜色,但我想知道代码只是保留文本颜色(以及任何其他样式/格式).
有什么建议？
我在html中有一些代码
<html>
<body>
<img src='an image source'/>
<h1>Hi it's test</h1>
<div id='mydiv'>
<img src='an image source'/>
<h1>Hi it's test</h1>
</div>
</body>
</html>
如果我使用以下css代码进行样式设置:
img{
width:100px;
height:100px;
}
h1{
font-size:26px;
color:red;
}
问题是:我如何通过公共标签样式阻止和隔离mydiv div标签内的标签？
基本上,我有一张桌子.Onload,我设置表的每一行,display:none因为我有很多javascript处理要完成,我不希望用户在完成时看到它.我设置了一个计时器,以便在一段时间后显示它,我的问题是我无法让表格行显示为表格行.如果我设置display:block,它将不会与标题(th)对齐.我发现的唯一解决方案是display: table-row来自css2,但是7及以下版本不支持此声明.
有解决方案吗
好吧,我有一个漂亮的网站,它的风格在CSS和一切
但是现在我发现了一个问题,我想要一个列表是处女,没有任何继承的风格.
我知道我可以做它只是给它一个style="(...)"所以它覆盖了继承的样式,但是,有没有任何指令/技巧/东西可以做到这一点吗？
我已经创建了一个在Google Chrome和Firefox中运行良好的网站,但是当我在Internet Explorer中运行它时,我遇到了问题.
所以,我的索引页面上有2个幻灯片,但只有一个应该以特定的屏幕分辨率显示.我创建了一些媒体查询,所以我可以设置一个display:none;我不需要的幻灯片.并使我再次出现,display:initial;但Internet Explorer不支持该命令.
我需要一种方法来显示我display:none;在Internet Explorer 中看不到的内容.
PS:使用visibility:hidden;不是一种选择,因为它不应该保留空间.
如果你能帮助我,请回复.如果你不能,我还是感谢你读这篇文章.
这是代码的来源; 它可能会有所帮助(我不确定如何正确发布,抱歉):
<section id="containerGrotePage">
<div id="page">
<ul id="slider">
<li><img src="images/slideshow/image2.jpg" alt="slideshow foto 1" /></li>
<li><img src="images/slideshow/image1.jpg" alt="slideshow foto 2" /></li>
<li><img src="images/slideshow/image3.jpg" alt="slideshow foto 3" /></li>
<li><img src="images/slideshow/image4.jpg" alt="slideshow foto 4" /></li>
</ul>
</div>
</section>
<div id="pageKlein">
<ul id="sliderKlein">
<li id="kleineSlideLi">
<img id="fotoslideshowKlein" src="images/slideshow/image1.jpg" alt="slideshow foto 1" />
</li>
</ul>
<button onclick="slideshowKlein()" id="indexkleineSlideshowKnop">volgende</button>
</div>
这是我在最小的屏幕上做的:
#containerGrotePage{
display:none;
}
#page{
display:none;
}
#kleineSlideLi{ …给定任何HTML元素是另一个元素的子元素并自动继承一系列CSS属性:如何将这些属性中的一个(或全部)设置为默认值？
例:
CSS:
.navigation input {
padding: 0;
margin: 0 30em;
}
HTML
<div class="navigation">
Some text: <input type="text" name="one" />
More text: <input type="text" name="two" />
<!-- The next input, I want it to be as browser-default -->
<div class="child">
<input type="text" name="three">
</div>
</div>
在这里,通过浏览器默认我的意思是我希望它看起来就像没有CSS应用于该元素一样.
这里我使用一个input元素作为例子,但我在谈论任何一种元素.我不是问如何为该特定元素设置不同的CSS属性,我问的是如何将其重置为默认值.
不同的元素具有不同的默认属性,例如padding未设置时.例如,button具有0CSS 填充的a 将包装其文本而没有任何空格.您可以稍后将其填充设置为另一个值,但是如何将其设置为默认填充？
提前感谢您的任何意见!
我正在尝试通过保留旧浏览器(特别是IE8,IE9和Opera 10+)的表格,将基于表格和JS的旧布局转换为具有向后兼容性的新Flexbox.
问题是没有display:flex-item覆盖旧的风格display:table-cell.
我尝试了各种各样的定义display:inherit,display:initial但没有一个能够重置显示定义以正常工作作为flex项.
<!-- HTML user list -->
<div class="userDetails layout">
<div class="picture"><img src="..."></div>
<div class="details">username, email, etc.</div>
</div>
/* CSS Table Layout */
.layout { display: table; width: 100%; }
.layout > .picture { display: table-cell; width: 30%; }
.layout > .details { display: table-cell; width: auto; }
/* CSS Flexbox - ignored by browsers that does not support it */
/* just an example - should use all versions …显然不是这种情况,因为每个元素都可以拥有它自己的默认值.
看这里:
https://developer.mozilla.org/en-US/docs/Web/CSS/display
初始值:内联
适用于:所有元素
当然,在这种情况下看起来更正确的文档是矛盾的.
https://www.w3schools.com/css/css_display_visibility.asp
这里有什么我想念的吗？
它似乎清楚地表明"所有元素"都将"初始值"设置为内联.
css ×10
html ×6
css3 ×2
display ×1
displaytag ×1
flexbox ×1
href ×1
slideshow ×1
tablelayout ×1