Share this page!

Pratham Profile picture
Twitter logo
23 May, 15 tweets, 4 min read
Here is a curated list of threads in chronological order that can help you learn the entire CSS 🎨

πŸ§΅πŸ‘‡πŸ»
1. Kickstart your CSS journey with this thread. It will give you a quick overview ✏️

2. First and foremost, learn about box-model, it will cover height, width, margin, padding and border πŸ“«

3. Next thing you can start learning about is CSS positioning πŸ“Š

4. Time to try a most confusing CSS property - The z-index πŸ—„οΈ

5. Media queries is the next thing we can learn πŸ“ΊπŸ“»πŸ–¨οΈ

6. Responsive Web Design is the most important topic πŸ–₯οΈπŸ’»πŸ“±

7. So far so good, Web Layout is the next thing we need to learn ✍️

8. Flexible box layout πŸ—„οΈ

9. Grid Layout is the next most important topic πŸ“Š

10. Its a good time to learn CSS animations 🏎️

11. Learn some advance CSS 🀯

12. CSS filter methods 🌈

13. Here are some of my handmade cheat sheets of CSS πŸ“ƒ

Did I forget something?

If in case you like it, share it with your connections, it means a lot to me ❀️

Peace out πŸ˜‰

β€’ β€’ β€’

Missing some Tweet in this thread? You can try to force a refresh
γ€€

Keep Current with Pratham

Pratham Profile picture

Stay in touch and get notified when new unrolls are available from this author!

Read all threads

This Thread may be Removed Anytime!

PDF

Twitter may remove this content at anytime! Save it as PDF for later use!

Try unrolling a thread yourself!

how to unroll video
  1. Follow @ThreadReaderApp to mention us!

  2. From a Twitter thread mention us with a keyword "unroll"
@threadreaderapp unroll

Practice here first or read more on our help page!

More from @Prathkum

Pratham Profile picture
25 May
A complete introduction to CSS animations πŸš€

CSS animation is a module in CSS that lets you change the styling of elements and therefore creates an animate effect. It's little tricky but not much

Let's learn about it πŸ§΅πŸ‘‡πŸ» Image
Before diving into it, we need to understand the importance of CSS animations

Animation can establish interaction between users and the user interface. This makes your website more interactive which ultimately attracts more visitors to your webpage.
CSS animations is little tricky but not too tough to master. In this thread, we will try to gain some decent knowledge about it.
Read 22 tweets
Pratham Profile picture
24 May
A long list of all CSS tips and tricks I shared here πŸ§΅πŸ‘‡πŸ»
1. Smooth scrolling

2. Change marker styling Image
Read 24 tweets
Pratham Profile picture
23 May
Web Layout πŸ–Ό

Structuring your website is essential as it provides better navigation and visualization of the content available on the site. Let's talk a little more about it and learn how we can create a proper layout

πŸ§΅πŸ‘‡πŸ»
Web layout aims for presenting imformation in a logical manner and to make the important elements stand out.

A well designed layout can catch more traffic on your website and make your content easy to understand
πŸ“Œ Design vs Layout?

Web layout is closely related to designing part. But we can say that web designing is much more than the layout only. It covers images, text, color scheme, typography and layout

On the other hand, Layout is all about arrangement of element on the webpage
Read 22 tweets
Pratham Profile picture
23 May
5 great icons websites for every web developer and designer ⏺️

πŸ§΅πŸ‘‡
1️⃣ Icons 8

- Icons8 is just more than icons. You can download illustrations, vector images, music and much more

πŸ–‡οΈ icons8.com
2️⃣ Icon Monstr

- Black and white themed minimal icons which looks super great. You can also cuatomize the thickness

πŸ–‡οΈ iconmonstr.com
Read 6 tweets
Pratham Profile picture
23 May
We can create cartoons using CSS as well πŸ˜‰

Let's decode in this thread how we can create Ferb using few simple CSS steps. Let's go

πŸ§΅πŸ‘‡πŸ»
STEP 1: Create a Face of rectangular shape

- Create a rectangle and rotate it a little bit
- Give it a solid border without border-bottom
- Position it
STEP 2: Create Lips

- Make a small square
- Add bottom and left border
- Skew it so that it seems like a lip
- Add little bit of bottom-left radius to give it a more realistic look
Read 14 tweets
Pratham Profile picture
22 May
Introduction to JavaScript β˜•

JavaScript is probably one of the most commonly used programming languages ​​nowadays. It has a wide range of applications in almost all technologies

πŸ§΅πŸ‘‡πŸ»
If you're planning to start with coding then JavaScript would not be a bad choice. In fact, it is the best choice. Why?

1. You can use it everywhere
2. A lot of jobs opportunities
3. Easy to learn
Lets talk about the use cases of JavaScript in bit detail

Web development is probably the largest field in IT industry. People all around the globe using web services in some context which makes this field even vast and eventually opens doors for beginners....
Read 22 tweets

Did Thread Reader help you today?

Support us! We are indie developers!

This site is made by just two indie developers on a laptop doing marketing, support and development! Read more about the story.

Become a Premium Member ($3/month or $30/year) and get exclusive features!

Become Premium

Too expensive? Make a small donation by buying us coffee ($5) or help with server cost ($10)

Donate via Paypal Become our Patreon

Thank you for your support!

Follow Us on Twitter!

Like this author's thread?

Get emails when @Prathkum has new unrolls!

Check out other threads from @Prathkum!

Read all threads by @Prathkum

:(