Skip to main content

CSS basics.


What is CSS?

  • CSS stands for Cascading Style Sheets
  • CSS describes how HTML elements are to be displayed on the screen, paper, or in other media
  • CSS saves a lot of work. It can control the layout of multiple web pages all at once
  • External stylesheets are stored in CSS files.
  • CSS is used to define styles for your web pages, including the design, layout, and variations in display for different devices and screen sizes.
  • CSS handles the look and feel part of a web page. Using CSS, you can control the color of the text, the style of fonts, the spacing between paragraphs, how columns are sized and laid out, etc.
The following are the advantages of CSS −
  1. CSS saves time − You can write CSS once and then reuse the same sheet in multiple HTML pages. You can define a style for each HTML element and apply it to as many Web pages as you want.
  2. Easy maintenance − To make a global change, simply change the style, and all elements in all the web pages will be updated automatically.
  3. Global web standards − Now HTML attributes are being deprecated and it is being recommended to use CSS. So it's a good idea to start using CSS in all the HTML pages to make them compatible with future browsers.
  4. Platform Independence − The Script offers consistent platform independence and can support the latest browsers as well.

☝





  • ID’s are unique


  • Each element can have only one ID
  • Each page can have only one element with that ID

When I was first learning this stuff, I heard over and over that, you should only use ID’s once, but you can use classes over and over. It basically went in one ear and out the other because it sounded more like a good “rule of thumb” to me rather than something extremely important. If you are purely an HTML/CSS person, this attitude can persist because to you, they really don’t seem to do anything different.

Here is one: your code will not pass validation if you use the same ID on more than one element. Validation should be important to all of us, so that alone is a big one. We’ll go over more reasons for uniqueness as we go on.

  • Classes are not unique

  • You can use the same class on multiple elements.
  • You can use multiple classes on the same element.

Any styling information that needs to be applied to multiple objects on a page should be done with a class. 


  • There are no browser defaults for any ID or Class

Adding a class name or ID to an element does nothing to that element by default.

This is something that snagged me as a beginner. You are working on one site and figure out that applying a particular class name fixes a problem you are having. Then you jump over to another site with the same problem and try to fix it with that same class name thinking the class name itself has some magical property to it only to find out it didn’t work.

Classes and ID’s don’t have any styling information to them all by themselves. They require CSS to target them and apply them to style.


Labels:

Comments

Post a Comment

Popular posts from this blog

UI/UX Introduction - What I learned

When I was young, I was passionate about computers. We couldn't have access to that. Usually, I play with some of the cardboard waste and make a computer screen and keyboard out of it.  After I got a good score in my O/Level exams, my father asked, "What do you want as a gift?" And I said I wanted a laptop. Then he purchased me an HP laptop. It was the best gift ever; I got it after a long wait. Later, I became familiar with basic computer skills slowly and started exploring the world through technology. Then, I chose IT as my career path eventually. Here, I'm sharing my learning experience to track my progress. UI/UX Introduction - What I learned https://www.mygreatlearning.com/academy/learn-for-free/courses/ui-ux It's a free course for beginners. Summary of this course: UI means interaction with user and website/product/app UX means what user experienced while using this UI Example: Using the Apple website, they direct their customers clearly to their products ...
Post a Comment
Read more

UX Writer

What is UX Writing? It is a subset of UX Design that mainly focuses on written bits. Written bits are words in menus, buttons, labels, chatbots, microcopy and error messages.  Microcopy means the set of instructions to guide first-time users through a product or the set of small pieces of writing.  Figma or Sketch can be used to plan and design copy for UX Writing. Who is UX Writer? A User Experience (UX)  Writer creates Written bits for apps, websites and other digital products that help users to get to know the product or get some basic idea about the product. (Refer :  Click here ) What is the job role? It's a similar role like copywriting, content writing and digital marketing specialist. A UX Writer might find the words for menus, buttons, labels, chatbots, microcopy and error messages. This is how UX Writing helps to communicate with Users What are the skills needed to become a UX Writer? Writing skills Research skills Technical skills UX Experience Probl...
Post a Comment
Read more

Movie card examples with CSS.

 Movie cards with CSS. Some new movie card designs with CSS References: https://freefrontend.com/css-movie-cards/ Here I shared one example(with HTML, CSS Coding) which I tried..... if you want more examples: https://freefrontend.com/css-movie-cards/ https://blog.avada.io/css/movie-cards/ https://newtodesign.com/7-css-movie-cards/ 😼😼😼Hope you get some new ideas about this topic.
Post a Comment
Read more