为什么CSS如此复杂？

-4

我正在读的CSS教程中，看到了这样的定义：为什么CSS如此复杂？

.content div { 
    -moz-box-shadow:inset 0px 1px 0px 0px #ffffff; 
    -webkit-box-shadow:inset 0px 1px 0px 0px #ffffff; 
    box-shadow:inset 0px 1px 0px 0px #ffffff; 
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #dfdfdf)); 
    background:-moz-linear-gradient(center top, #ededed 5%, #dfdfdf 100%); 
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#dfdfdf'); 
    background-color:#ededed; 
    -webkit-border-top-left-radius:6px; 
    -moz-border-radius-topleft:6px; 
    border-top-left-radius:6px; 
    -webkit-border-top-right-radius:6px; 
    -moz-border-radius-topright:6px; 
    border-top-right-radius:6px; 
    -webkit-border-bottom-right-radius:6px; 
    -moz-border-radius-bottomright:6px; 
    border-bottom-right-radius:6px; 
    -webkit-border-bottom-left-radius:6px; 
    -moz-border-radius-bottomleft:6px; 
    border-bottom-left-radius:6px; 
    text-indent:0; 
    border:1px solid #dcdcdc; 
    display:inline-block; 
    color:#777777; 
    font-family:arial; 
    font-size:15px; 
    font-weight:bold; 
    font-style:normal; 
    line-height:50px; 
    text-decoration:none; 
    text-align:left; 
    text-shadow:1px 1px 0px #ffffff; 
}

一个简单的DIV标签需要这么多的代码风格。如何学习所有这些？它真的有必要吗？

来源

2015-11-20 user697911

不，一个简单的DIV不需要太多的代码，这取决于你的需求。事实上，一个简单的DIV根本不需要任何CSS。你的代码包含很多不再需要的浏览器前缀（例如，整个'* -border-radius *'可以简单的写成'border-radius：6px'）。 *如何学习所有这些* - 阅读一些教程，请参阅MDN。 *是否真的有必要* - 正如我前面所说，代码的数量取决于你需要的。 – Harry

你在抱怨什么？ CSS不工作或其复杂？ -webkit和-moz是浏览器前缀。 –

webkit和moz是什么？ – user697911

你不需要学习关于css的一切。如果你真的在开发前端，你必须学习基础知识。

这些浏览器扩展用于浏览器兼容性或用于在浏览器上顺利工作。

-webkit-在铬，safary和其他浏览器

-moz-用于mozila

在一些博客和辅导时，他们使用一些过时的CSS代码。这些特别适用于较低版本的Internet Explorer和其他浏览器。

不要太担心这些代码。您的代码将取决于要求。

如果你有学习CSS的压力，不要担心，我们大多数人都会在我们开始时体验到这一点。

首先从简单的CSS样式开始。试着先从这里开始http://www.w3schools.com/。学习需要时间，喝醉时不是药，它会立即生效。

来源

2015-11-20 06:10:22 Tyler

其中大多数都是不言自明的，特别是没有前缀（webkit，moz，msie ...）。您应该只采用您需要的样式规则来修改您的div，使其脱离默认的浏览器样式，或者甚至更好地使用一组重置规则，以使该div在所有浏览器中都保持一致。

而且，由于你的代码似乎已经过时，例如，这一切：

border-radius:6px;

有吨在线：

-webkit-border-top-left-radius:6px; 
-moz-border-radius-topleft:6px; 
border-top-left-radius:6px; 
-webkit-border-top-right-radius:6px; 
-moz-border-radius-topright:6px; 
border-top-right-radius:6px; 
-webkit-border-bottom-right-radius:6px; 
-moz-border-radius-bottomright:6px; 
border-bottom-right-radius:6px; 
-webkit-border-bottom-left-radius:6px; 
-moz-border-radius-bottomleft:6px; 
border-bottom-left-radius:6px;

可以在所有现代浏览器取代和缺兵少将本关于CSS样式和规则的资源。

来源

2015-11-20 05:23:13 Shomz

为什么CSS如此复杂？

回答

相关问题