I dont know if you meant that you are trying to create an online tool or not. If you are, I guess I just find the UI confusing, even if teh features promise to be robust. Do look at w3schools.com, "tryIT" UI.
If what you are trying to do is to be able to see for your self what each propriety does, I would think it would think a good tool would be FIREBUG. FIREBUG lets you add/remove/disable/enable code live onscreen! There a quite a few advantages to Firebug that come to mind
1) It does what you are intending, on any piece of code. So you could start with a simple HTML document you made yourself and use Firebug to inspect it... and move up to inspecting complex coding masterpieces. This allows you to learn formulaically, that is you can come in with your own assumption of how the property behaves, and then have a sample ( and a calculated value).
2) Firebug show you which rules are overriding which.. so along with a property you get to see HOW THE CASCADE works. This is just as important in CSS as knowing what "command" does what
3) Because you can tweak style sheets live and non-destructively you can test out your hypothesis' of how rules behave. Personally I find that to be a great learning aid... beign able to to confirm if the way I THINK something should work is teh way it ACTUALLY does work.
4) Firebug is already a great debugging tool for experts, so once you do master CSS you have also become familiar with a great way to DEBUG your work ( as opposed to going through the effort of coding a learning tool which you intend to abandon once you're semi-comfortable with CSS)