Pratham Profile picture
15 May, 4 tweets, 4 min read
You can check out these websites if you're learning HTML, CSS and JavaScript 🧵...
HTML 🧱

1. Learn HTML
learn-html.org

2. HTML best practice
hail2u.github.io/html-best-prac…

3. HTML reference
htmlreference.io
CSS 🎨

1. CSS reference
cssreference.io

2. Learn to code
learn.shayhowe.com

3. CSS layout
learnlayout.com

4. CSS tutorial
csstutorial.net

5. Learn about colors
hexinvaders.com

6. Learn gird layout
griddy.io
JavaScript ⚙️

1. JavaScript visualizer
jsv9000.app

2. Learn JavaScript
learn-js.org/en/
learnjavascript.online

3. JavaScript tutorial
javascripttutorial.net

4. JavaScript 30
javascript30.com

5. JavaScript alogs
github.com/trekhleb/javas…

• • •

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

17 May
5 great background websites for every web developer and designer

🧵👇 Image
1. Magic pattern

Beautiful pure CSS background patterns that you can actually use in your projects. They are highly customizable as well.

🖇️ magicpattern.design/tools/css-back… Image
2. Cool backgrounds

Collection of cool backgrounds that you can add to blogs, websites, or as desktop and phone wallpapers

🖇️ coolbackgrounds.io Image
Read 6 tweets
17 May
Have you heard the term "Tooltip" in web development?

Tooltips guide your visitors to take action and hence provides extra layer of guidance without any difficulties and hence increase the user experience

Let's create a tooltip using HTML and CSS only 🧵👇🏻 Image
We just need to create an element that we will be visible only when user moves the mouse pointer over an elment

STEP1: Let's start with the HTML structure <div class="content&qu...
STEP2: Popup text

- Add some width and padding
- Hide the popup element throughout and show it only on hover
- Place it above the element
- Add little transition for smooth rendering Image
Read 7 tweets
17 May
CSS art is a good way to enhance and improve your CSS knowledge.

Let's create Phineas using pure CSS in few simple steps 🧵👇🏻 Image
STEP 1. Create a head

create a triangle and rotate it so that it looks like a head ImageImage
STEP 2. Create smile and ear

We have a pseudo elements in CSS, so we can create smile and ear using head::after and head::before. Its a good way to learn about pseudo-elements ImageImage
Read 11 tweets
16 May
Functions exists in CSS as well

CSS functions can represent more complex data types and can do special data processing and calculations. Let's talk about it in detail

🧵👇🏻 Image
The syntax of CSS functions is same and standard like in other programming languages. Function name followed by the set of parenthesis and they can accept multiple argument.

{ 2 / 16 }
The functions in CSS is broadly divided into 8 categories. They are

1. Transform functions
2. Math functions
3. Filter functions
4. Color functions
5. Image functions
6. Counter functions
7. Font functions
8. Shape functions

{ 3 / 16 }
Read 16 tweets
15 May
Are you planning to learn CSS for adding some cool styling in your website?

In this thread, I'm covering all the basics and proper plan you need to know in order to getting started with CSS.

🧵 👇🏻
We need to know the importance of CSS first. Why CSS?

Well I guess CSS is the only language that add some visuals in website. Without CSS, Without it, websites would still be plain text on white backgrounds.

{ 02 / 17 }
Let's compare a website with and without CSS

Image 1: With CSS
Image 2: Without CSS

{ 03 / 17 }
Read 17 tweets
15 May
5 best color palette for every web developer and designer 🎨

🧵👇
1. Color hunt

- Color Hunt is a free and open platform for color inspiration with thousands of trendy hand- picked color palettes

🖇️ colorhunt.co
2. Adobe color wheel

Explore and create accessible color palettes using color wheel, in variety of color variations and contrast levels. It will tell you automatically if two colors are not accessible

🖇️ color.adobe.com/create/color-a…
Read 6 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!

:(