6 HTML Attributes you may not be using.

A Thread πŸ‘‡
1️⃣ Contenteditable

Specifies whether the content of an element is editable or not.

All you have to do is set the contenteditable attribute on nearly any HTML element to make it editable.
2️⃣ Spellcheck

The spellcheck attribute specifies whether the element is to have its spelling and grammar checked or not.

The following can be spellchecked:

-Text values in input elements (not password)
-Text in <textarea> elements
-Text in editable elements
3️⃣ Download

The download attribute specifies that the target (the file specified in the href attribute) will be downloaded when a user clicks on the hyperlink.

The optional value of the download attribute will be the new name of the file after it is downloaded.
4️⃣ Hidden

The hidden attribute is a boolean attribute.

When present, it specifies that an element is not yet, or is no longer, relevant.

The hidden attribute can also be used to keep a user from seeing an element until some other condition has been met .
5️⃣ Multiple

The multiple attribute is a boolean attribute. It specifies that the user is allowed to enter/select more than one value.

Valid for the email and file input types and the <select>,the manner by which the user opts for multiple values depends on the form control.
The multiple attribute works with the following input types: email, and file.

For <input type="file"> : To select multiple files, hold down the CTRL or SHIFT key while selecting.
For <input type="email">: Separate each email with a comma, like: mail@example.com, mail2@example.com, mail3@example.com in the email field.
6️⃣ Poster

The HTML poster Attribute is used to display the image while the video is downloading or when the user clicks the play button.

If this image not set then it will take the first frame of video as a poster image.
That's all for this thread. If you found it useful a retweet to the first tweet would mean a lot.😊

β€’ β€’ β€’

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

Keep Current with Insha

Insha 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 @girl_whocode

3 Jun
7 Chrome Extensions for Front-end Developers.

A Thread πŸ‘‡
1⃣ WhatFont

The easiest way to identify fonts on web pages.

With this extension, you could inspect web fonts by just hovering on them.

πŸ”— chrome.google.com/webstore/detai… Image
2⃣ ColorPick Eyedropper

A zoomed eyedropper & color chooser tool that allows you to select color values from webpages and more.

πŸ”— chrome.google.com/webstore/detai… Image
Read 9 tweets
31 May
CSS Pro tips you might not know.

A Thread πŸ‘‡
1⃣ user-select property

The user-select property specifies whether the text of an element can be selected or not.
2⃣ place-item property

The CSS place-items is a shorthand property that allows you to align items along both the block and inline directions at once (i.e. the align-items and justify-items properties) in a relevant layout system such as Grid or Flexbox.
Read 8 tweets
30 May
10 Free Resources for Color Palette Inspiration.

A Thread πŸ‘‡
1⃣ Pigment

Pigment by Shapefactory is by far the best color palette generator on the internet and is recommended by designers everywhere.

πŸ”— pigment.shapefactory.co Image
2⃣ Coolors

Coolors is a super fast color scheme generator that allows you to create, save, and share perfect palettes in seconds.

πŸ”—coolors.co Image
Read 12 tweets
28 May
7 Developer tools you won't believe exist.

A Thread πŸ‘‡
1⃣ Keycode

Press any key to get the JavaScript event key code.

πŸ”— keycode.info
2⃣ Screen size map

The screen size map compares viewport sizes in device-independent pixel to plan responsive and fluid layouts for great UI/UX design in digital products.

πŸ”— screensizemap.com
Read 9 tweets
26 May
Websites for free Stock Images.

A Thread πŸ‘‡
➑️ PEXELS

Free stock photos and videos you can use everywhere . βœ“ High-quality βœ“ 100% free.

πŸ“Ž pexels.com
➑️ UNSPLASH

Beautiful, free images and photos that you can download and use for any project.

πŸ“Ž unsplash.com
Read 9 tweets
25 May
5 Websites to get free PNG icons.

A Thread πŸ‘‡
➑️ FLATICON

Flaticon is a database of free vector icons directly to Photoshop.A tool that converts icons into web fonts.

πŸ“Ž flaticon.com
➑️ PNG TREE

PNG tree provides free download of png, png images, backgrounds and vector.

πŸ“Ž pngtree.com
Read 7 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!

:(