codemarch Profile picture
Dec 4, 2022 โ€ข 6 tweets โ€ข 2 min read โ€ข Read on X
CSSย Links

Visually Explained๐Ÿ“

Thread ๐Ÿงต
CSSย Links

The four links states are:

๐Ÿ”น `a:link`ย - a normal, unvisited link
๐Ÿ”น `a:visited`ย - a link the user has visited
๐Ÿ”น`a:hover`ย - a link when the user mouses over it
๐Ÿ”น `a:active`ย - a link the moment it is clicked
Text Decoration๐Ÿ‘‡

Theย `text-decoration`ย property is mostly used to remove underlines from links:
Background Color๐Ÿ‘‡

Theย `background-color`ย property can be used to specify a background color for links:
Link Buttons๐Ÿ‘‡

This example demonstrates a more advanced example where we combine several CSS properties to display links as boxes/buttons:
End of this Thread๐Ÿงต
If you enjoyed this thread, don't forget to like, comment, and retweet the opening tweet.

Follow @codemarch and enable notifications.
we help developers to understand HTML, CSS & JavaScript in depth.
codemarch.gumroad.com/l/hxazr

โ€ข โ€ข โ€ข

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

Keep Current with codemarch

codemarch 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 @codemarch

Jul 30
๐—๐—ฎ๐˜ƒ๐—ฎ๐—ฆ๐—ฐ๐—ฟ๐—ถ๐—ฝ๐˜ ๐—”๐—ฟ๐—ฟ๐—ฎ๐˜†๐˜€(๐—ฃ๐—ฎ๐—ฟ๐˜-๐Ÿฎ) Image
๐—”๐—ฐ๐—ฐ๐—ฒ๐˜€๐˜€๐—ถ๐—ป๐—ด ๐—”๐—ฟ๐—ฟ๐—ฎ๐˜† ๐—˜๐—น๐—ฒ๐—บ๐—ฒ๐—ป๐˜๐˜€.
The index number is used to access an array element:

๐™ฝอŸ๐š˜อŸ๐šอŸ๐šŽอŸ:อŸโ€‚อŸ๐™ฐอŸ๐š›อŸ๐š›อŸ๐šŠอŸ๐šขอŸโ€‚อŸ๐š’อŸ๐š—อŸ๐šอŸ๐šŽอŸ๐šกอŸ๐šŽอŸ๐šœอŸโ€‚อŸ๐šœอŸ๐šอŸ๐šŠอŸ๐š›อŸ๐šอŸโ€‚อŸ๐š อŸ๐š’อŸ๐šอŸ๐š‘อŸโ€‚อŸ๐ŸถอŸ.อŸ

[0] is the first element.
[1] is the second element.
[2] is the third element. Image
๐—–๐—ต๐—ฎ๐—ป๐—ด๐—ถ๐—ป๐—ด ๐—ฎ๐—ป ๐—”๐—ฟ๐—ฟ๐—ฎ๐˜† ๐—˜๐—น๐—ฒ๐—บ๐—ฒ๐—ป๐˜.
we can change the value of the elements in an array.
๐—˜๐˜…๐—ฎ๐—บ๐—ฝ๐—น๐—ฒ: Image
Read 12 tweets
Jul 10
CSS Colors

Visually explained: Image
Image
Image
Read 17 tweets
Jul 8
Free HTML/CSS Templates: Image
Image
Image
Read 9 tweets
Jul 7
Learn HTML & CSS in 50 Days:
Days 1-5: HTML Basics

โž” Introduction to HTML
โ€ข What is HTML?
โ€ข HTML Syntax
โ€ข Elements and Tags

โž” Basic HTML Structure
โ€ข Head, Body, Title
โ€ข Paragraphs, Headings

โž” Project:
โ€ข Simple Personal Bio Page
Days 6-10: HTML Intermediate

โž” Links and Images
โ€ข Internal, External, Anchor Links
โ€ข Adding Images, Alt Text

โž” Lists and Tables
โ€ข Ordered, Unordered, Nested Lists
โ€ข Basic Table Structure

โž” Project:
โ€ข Simple Blog Page
Read 13 tweets
Jan 31
Learn React in 30 Days.

Complete Structure:
Pre-Requisite:

Javascript Before React - Content Added. Image
Week 1: Introduction and Basics Image
Read 9 tweets
Jan 4
Components in React.

Explained: Image
Real-Life Example:

Imagine building a house ๐Ÿ .

Each room (kitchen, bedroom, bathroom) represents a component.

React components contain particular UI and behaviour, just as rooms have particular purposes and looks.

Let's explore these "rooms" in the world of React!
๐Ÿ”น Functional Components:

โ€ข Simpler and more concise.
โ€ข Stateless (initially).
โ€ข Use functions to return JSX.
โ€ข With Hooks, they've become even more powerful!

Example: Image
Read 12 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

Don't want to be a Premium member but still want to support us?

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

Donate via Paypal

Or Donate anonymously using crypto!

Ethereum

0xfe58350B80634f60Fa6Dc149a72b4DFbc17D341E copy

Bitcoin

3ATGMxNzCUFzxpMCHL5sWSt4DVtS8UqXpi copy

Thank you for your support!

Follow Us!

:(