请教前端的前辈们， HTML/CSS 如何进一步修炼呢？看书上给的代码（这本书主要讲的是 JS CSS/HTML 都是提供好的）觉得它生成的网页很不错，但一看 CSS 代码就觉得“哇，这怎么写出来的。。”

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

这是一个创建于 2690 天前的主题，其中的信息可能已经有所发展或是发生改变。

那个网页的本来目的是教 JS 本地存储的 API 用的能够在网页上贴便签，关掉来下次还能看见
那个便签蛮好看的（颜色啊大小啊），角度略略有一点倾斜，然后鼠标悬停上去旋转角度会变化，并且会放大一些，挺动态。
然后我去看 CSS 代码。。

	-webkit-box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.4);
	-moz-box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.4);
	-o-box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.4);
	box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.4);
	-webkit-transition: all 0.5s ease-in;
	-moz-transition: all 0.5s ease-in;
	-o-transition: all 0.5s ease-in;
	-ms-transition: all 0.5s ease-in;

出现了很多这种内容，我也去网上查了一下自己设置一下看看。。
然而我发现这个单个设置起来效果不是很明显，怎么说呢，感觉很难像其他 CSS 属性一样多用几次明白效果，记住了，以后就会用了，很玄学。。不知道这些内容自己该怎么去精通。
emmm 还有一个问题就是发现自己虽然初步入门了 HTML/CSS，了解和背下了许多属性，然而还是有很多属性可能不算常用，但一旦用得好效果就很不错……可这些零零碎碎的属性能怎么办呢？就像背单词一样把它们也都背下来吗？
谢谢！~

8 条回复 • 2017-08-16 19:51:06 +08:00

lwbjing

2017-08-16 13:53:32 +08:00

多练... 找不同的结构、效果练...
不用硬背，先熟悉一遍，把一些属性都了解一下，
当你开始写的时候，比如你要圆角，你该用什么，你要其它的效果该怎么样。。

hardensky

2017-08-16 13:54:11 +08:00

前端东西本来就很杂很多记不清楚具体属性名或者用法也没关系，知道有这回事就行了需要的时候能通过搜索引擎拾起来就行了

不过楼主发的这个还算常用了，多看看 MDN 吧

jy02534655

2017-08-16 15:33:00 +08:00

这样的写就是为了处理兼容问题呀，不用记那么多，记住其中没前缀的那个用法就行了。你看他们的值都是一样的，你要是会用 sass 或者 less 可以写一个宏来处理这个的，比如说

@mixin box-shadow($h-shadow,$v-shadow,$blur,$spread,$shadow-color) {
$value: $h-shadow $v-shadow $blur $spread $shadow-color;
-webkit-box-shadow: $value;
-moz-box-shadow: $value;
-ms-box-shadow: $value;
box-shadow: $value;
}

然后
@include box-shadow(0, 1px, 8px, 0,#f2f2f2);
这样调用就不麻烦

还有现在很多效果网上都有生成器，比如 http://code.ciaoca.com/想要什么效果直接用他提供的生成器生成一个就行了，不用考虑那么多...