Web Graphics Tutorial: Learn by doing!

Alright guys. I created a simple guide today on how to use clip-paths, svgs, and loops and arrays to create some fun and exciting front end stuff. I made this with basic html/css/javascript so it should be easy for everyone to understand, even if front end is not your thing.

This is my first go at a tutorial-format website. By making a tutorial I also got to brush up on basic skills. You can view the full website here.

It's exciting to be able to hop on the code editor and buzz along without too much googling.

I had a lot of fun making this and I hope you like it as much as I do!

I felt like clip-paths and svgs had many uses in common in a broader sense and I wanted to investigate. A comparison of when to use svg vs clip path is below!

---

And lastly, on the arrays page we come to see that the possibilities are really endless.

Let me know what you think! There may be some imperfections and redundancies, but it's working. Right now that's what's important to me!

The above is the detailed content of Web Graphics Tutorial: Learn by doing!. For more information, please follow other related articles on the PHP Chinese website!