11个实用的CSS学习工具
1. 盒子模型的幻灯片
通过3D转换效果产生的互动的幻灯片。按向左或向右箭头键切换，全屏观看会有更好的效果。
2. CSS Diner
通过一个简单的小游戏让你学习CSS selector，输入正确的selector来完成每一关。你也可以通过菜单来选关。
3. CSS Selectors 交互
这是一个简单可视化CSS选择器。选择左边菜单中的选择器,选择的条目就会出现在右边。
4. 前端Web开发考查
CSS 属性有大小写之分吗？
5. The Magic of CSS
这里有6个章节的CSS教程，更深入的教程会慢慢开放。
6. Enjoy CSS
一个学习CSS的圣地，它专注于CSS。
6
7. CSS Guidelines
Harry Roberts 已经更新了他的开放资源。之前只是GitHub上的一个库，现在已经有了自己的域名，并且优化并更新了很多资源。
8. CSS Triggers…
Chrome开发者Paul Lewis创造了一个页面解析参考,当给定的CSS属性变更时它会发挥自己的作用。例如,一些属性将触发重绘和合成,但不会引发布局。我们可以很容易地通过CSS Triggers来发现这些变化。
9. mdo贡献的代码指南
Bootstrap’s的Mark Otto 整理了他自己风格的HTML和CSS指南，这些建议包括属性的顺序，顺序的HTML属性选择器等等。
10. Flexplorer
这是一个简单的应用，用来来摆弄各种flexbox特性并查看出现在页面上的实时的完整代码。它有一个很酷的特性，你还可以通过它来编辑页面上的文本框，允许您看到这些变化是如何影响其它内容的。
11. CSS Selectors: Targeting HTML Like a Pro
Russ Weakley的新课程，是SitePoint的姐妹网站,这里有超过20个视频介绍的CSS的Selector元素。这不仅仅是一个简约的插件，而且作业是一个真正的CSS专家。所以如果你刚刚开始用CSS和还没掌握选择器,这可能是一个不错的选择。
总结
不管你的CSS水平如何，我可以保证这些东西肯定能帮到你，如果你手上有正在进行的相关项目，或是其它不错的资源可以拿出来和大家一起分享。
极客标签 - 专业和精准的分享，关注你感兴趣的极客，社区提供超棒的精品教程，互动授课
阅读原文：11个实用的CSS学习工具
11个实用的CSS学习工具的更多相关文章
- 11个实用的CSS学习工具[转载收藏]
1. 盒子模型的幻灯片 通过3D转换效果产生的互动的幻灯片.按向左或向右箭头键切换,全屏观看会有更好的效果. 2. CSS Diner 通过一个简单的小游戏让你学习CSS selector,输入正确的 ...
- 干货！IT小伙伴们实用的网站及工具大集合！持续更新！
1.Git 还在担心自己辛辛苦苦写的代码被误删了吗?还在担心自己改错了代码不能挽回吗?还在苦恼于多人开发合作找不到一个好的工具吗?那么用Git就对 了,Git是一个开源的分布式版本控制系统,用以有效. ...
- 35款加速网站开发的 CSS 开发工具
网络有很很多的 CSS 工具和教程可用,它可以帮助设计人员和开发人员轻松.快速地学习 CSS 技术.这些工具中在高效开发 Web 应用程序中发挥重要作用. 在这篇文章中,我们收集了35个最好的 CSS ...
- 2015年最佳的12个 CSS 开发工具推荐
CSS所能做的就是改变网页的布局.排版和调整字间距等,但编写 CSS 并不是一项容易的任务,当你接触新的 CSS3 属性及其各自的浏览器前缀的时候,你会发现很伤脑经.值得庆幸的是一些优秀的开发人员提供 ...
- HTML与CSS学习记录
title: HTML与CSS学习记录 toc: true date: 2018-09-10 14:04:59 <HTML与CSS进阶教程读书笔记> HTML基础知识 HTML与XHTML ...
- CSS 学习手册
目录 CSS 简介 1.CSS 简介 CSS 概述 层叠次序 2.CSS 基础语法 CSS 语法 值的不同写法和单位 记得写引号 多重声明: 空格和大小写 3.CSS 高级语法 选择器的分组 继承及其 ...
- css学习归纳总结（三） 转
原文地址:css学习归纳总结(三) 为文档添加样式的三种方法 行内样式 行内样式是写在HTML标签的style属性里的,比如: <p style="font-size: 12px;fo ...
- css学习归纳总结（二） 转
原文地址:css学习归纳总结(二) 标签与元素 <p>标签和p元素有什么区别呢?大多数时候他们表示的是同一样东西,但仍有细微的区别.<p>.<div>等指的是HTM ...
- 15个实用的CSS在线实例教程
前端技术可以说是必须学习的一个技术,现在做网站都需要懂DIV.CSS,在国内很多企业招网页设计师都要求会写基本的前端代码,所以前端技术是 必须了解的,对网页设计师本身也有帮助,今天向大家推荐一些不错的 ...
随机推荐
- 洛谷.3803.[模板]多项式乘法(NTT)
题目链接:洛谷.LOJ. 为什么和那些差那么多啊.. 在这里记一下原根 Definition 阶 若\(a,p\)互质,且\(p>1\),我们称使\(a^n\equiv 1\ (mod\ p)\ ...
- 【POJ】1840：Eqs【哈希表】
Eqs Time Limit: 5000MS Memory Limit: 65536K Total Submissions: 18299 Accepted: 8933 Description ...
- 使用socket.io+redis来实现基本的聊天室应用场景
本文根据socket.io与Redis来实现基本的聊天室应用场景,主要表现于多个浏览器之间的信息同步和实时更新. 只是简单记录了一下, 更详细的内容可以参考后续的一篇补充文章: 使用node.js + ...
- Linux终端（Xshell等）的编码设置
先简单说说一下遇到的情况吧: 在用类似Xshell的工具连接远端Linux时,运行命令ls时,如果有中文,就会显示有乱码: 网上查资料时,也把相应的连接属性修改为utf-8了(见下图),但是还是不行: ...
- 信用卡：银联，VISA，MasterCard
国际信用卡是一种银行联合国际信用卡组织签发给那些资信良好的人士并可以在全球范围内进行透支消费的卡片,同时该卡也被用于在国际网络上确认用户的身份. 国际发卡组织是一个由全世界银行参与的非营利的国际性组织 ...
- 原生js实现图片预览并上传
最近主导的PC客户端网站重构工程告一段落,下一阶段开始给公司APP开发H5页面,技术栈是react.最近碰到一个需求:需要在H5页面上添加身份证照片,预览并上传.因为要兼容安卓4.4以下版本的手机,所 ...
- anroid源码下载和编译
本文是在Ubuntu10.10系统上进行实践的. 1 因为我们需要Android的模拟器,所以需要安装Android的SDK,并创建AVD, 可以一次命名为AVD15,AVD22,AVD23,... ...
- Saving HDU hdu
话说上回讲到海东集团面临内外交困.公司的元老也仅仅剩下XHD夫妇二人了.显然.作为多年拼搏的商人,XHD不会坐以待毙的. 一天,当他正在苦思冥想解困良策的时候.突然想到了自己的传家宝,那是公司成立的时 ...
- vld,Bounds Checker,memwatch,mtrace,valgrind,debug_new几种内存泄露检测工具的比较,Valgrind Cheatsheet
概述 内存泄漏(memory leak)指由于疏忽或错误造成程序未能释放已经不再使用的内存的情况,在大型的.复杂的应用程序中,内存泄漏是常见的问题.当以前分配的一片内存不再需要使用或无法访问时,但是却 ...
- SpringMVC处理方法的数据绑定
一.SpringMVC数据绑定流程 Spring MVC通过反射机制对目标处理方法的签名进行解析,将请求消息中的信息以一定的方式转换并绑定到处理方法的入参中.数据绑定的核心部件是DataBinder, ...