小编Dyl*_*cho的帖子

是否可以仅更改文字阴影的颜色?

我有9个不同颜色的按钮(红色,橙色,黄色,绿色,蓝色,紫色,粉红色,灰白色和石板),我想知道是否可以操作和改变text-shadow这些按钮的CSS属性的颜色,同时保持其他值相同?

例如,我有两个不同的类; 一个是11px字体大小的按钮,另一个是14px字体大小(我网站上的标准):

.button-11 {
    font-size: 0.8em;
    border-width: 0.09091em;
    border-style: solid;
    padding: 0 0.90909em;
    text-shadow: 0.09091em 0.09091em 0 rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: 0 -0.09091em rgba(255, 255, 255, 0.3) inset;
    -moz-box-shadow: 0 -0.09091em rgba(255, 255, 255, 0.3) inset;
    box-shadow: 0 -0.09091em rgba(255, 255, 255, 0.3) inset;
}

.button-14 {
    border-width: 0.07143em;
    border-style: solid;
    padding: 0 0.71429em;
    text-shadow: 0.07143em 0.07143em 0 rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: 0 -0.07143em rgba(255, 255, 255, 0.3) inset;
    -moz-box-shadow: 0 -0.07143em rgba(255, 255, 255, …
Run Code Online (Sandbox Code Playgroud)

css fonts css3

10
推荐指数
2
解决办法
7864
查看次数

我应该使用新的HTML5语义元素吗?

我正在升级我的网站,这涉及到使用新的HTML5语义元素而<nav> <header> <footer> <aside> <section>不是常规旧<div>元素的决定.

我计划支持IE7和IE8,但我知道这些版本不支持上述语义元素.我已经读过像Modernizr,Initializr和HTML5shiv这样的'插件',而且我知道旧的浏览器会支持新的元素,如果启用了JavaScript,但如果不是,我该怎么办呢?

默认情况下,<html>标记被赋予类,no-js如果启用了JavaScript,则Modernizr/Initializr将替换此类js.这一切都很好,但有一些我不确定的事情.到目前为止,涵盖的是什么?

排序

  • 如果启用了JavaScript,则Modernizr/Initializr支持IE7和IE8.
  • 使用reset.css文件,其他旧版浏览器支持这些新标记.
  • 现代浏览器都很好.

问题

  • 如果JavaScript被禁用,我应该怎么做IE8及以下?将no-js类添加到<html>标签,所以我究竟有什么可以做呢?
  • 我怎样才能<noscript>在这里利用我的优势?我不希望通过编码使页面太大.

因此,除了这些问题之外,我还想问一下,使用这些标签是否真的值得,当我可以使用<div>既支持旧浏览器的好的标签,又通过消除所需的编码来保持文件大小标签适用于旧浏览器?

谢谢你,迪伦.

javascript css html5 modernizr

6
推荐指数
1
解决办法
1522
查看次数

显示:table是一个完全可以接受的等高柱的方法吗?

我正在建立一个响应式设计,我需要两个相同高度的列.我不想依赖JavaScript,我希望列之间有空格,以增加清晰度.

我做了两个布局; 一个使用display:table;,另一个使用floatposition.这里的问题是我似乎无法让后一种方法在列之间有空格,而table方法在这方面工作正常.

因此,我理想地喜欢使用表格方法,但我想知道这是否是一种可接受的方法来实现一个使用现代网络标准的网站的等高柱设计?

CSS表支持研究

通过一些研究,我发现该display:table方法与以下浏览器兼容(通过支持我需要的所有必要的CSS属性):

  • Chrome 1+
  • Firefox 1+
  • Internet Explorer 8+
  • Safari 1.2+
  • Opera 7+
  • Android 2.1+
  • iOS 3.2+
  • 黑莓6+
  • Internet Explorer Mobile 9+(Windows Phone 7+)
  • Opera Mobile 10+
  • Opera Mini 5+
  • 诺基亚浏览器7.3+(Symbian Anna)
  • 诺基亚浏览器8.5+(诺基亚N9上的MeeGo 1.2)

谷歌搜索"CSS CSS显示表是个好主意吗?" 揭示了一些反对CSS表方法的文章,特别是这篇文章,我一直在阅读.我知道它已经有好几年了,所以考虑到我上面发现的浏览器支持水平,现在这个方法的整体接受程度到底是什么?

笔记

  • 我想放弃对Internet Explorer 7及以下版本的支持,我不确定Firefox 3及以下版本(对建议开放).

  • 此外,我通常希望在较旧的浏览器/浏览器版本中进行测试,但我的笔记本电脑没有足够的RAM来运行虚拟机,并且下载必要的文件需要花费数小时才能完成10-20 Mb/s的不定连接.有没有其他选择(房子里的所有其他电脑也没有旧的浏览器)?

谢谢!

参考

  • 我自己在Chrome 30,Firefox 24/25,Safari 5.1.7,Opera 17,IE 10/11,IE8/IE9中使用IE10开发人员工具和Android 4.1.1进行测试.
  • W3Schools CSS参考 - 显示 ; 边界崩溃 ; …

css html5 responsive-design

5
推荐指数
1
解决办法
343
查看次数

根据 DIV 的宽度更改背景颜色

我想使用 jQuery<div>根据 CSS 属性值动态修改 a 的背景颜色width

该用法用于某种形式的颜色编码仪表,它指示设备在特定类别(有 5 个)中的表现有多好(或差),然后有一个“总体”类别,它根据一点数学知识(将所有 5 加起来,然后将答案除以 5)。

我尝试了两种方法,一种基于我所拥有的一点 jQuery 知识,另一种改编自 SO 上的答案。两者都包含在我提供的 JSFiddle 中,后者被注释掉了。

以下是每种颜色和宽度范围:

  • 0-24% = 红色 - #a41818
  • 25-49% = 橙色 - #87581c
  • 50-74% = 黄色 - #997815
  • 75-90% = 黄绿色 - #7ba01c
  • 91-100% = 绿色 - #3a8d24

谢谢!

html javascript css jquery

2
推荐指数
1
解决办法
3378
查看次数

标签 统计

css ×4

html5 ×2

javascript ×2

css3 ×1

fonts ×1

html ×1

jquery ×1

modernizr ×1

responsive-design ×1