Breaking News

Understanding CSS Basics.

Understanding CSS Basics.

In this article, I want to give you the CSS Basics information about Understanding CSS Browser Style, CSS Specifications, CSS Editors Features, Tracking Browser Support.

CSS Basics

Understating CSS Default Browser Style.

So, I want to start CSS Basics here by opening an un-styled page in a web browser. You can also do the same.

Although I am using Firefox fill free to use your favorite browser and I am just going to open file namely default.html and you can see its coding as below. Copy and paste in your favorite code editor and save it with extension .html.

<! doctype html>

<html>

<head>

<title> CSS Basics </title>

</head>

<body>

<h1>Default</h1>

<p>

You see that the page which we have opened here it is un-styled page.</p>

<a href=”https://www.computertaleem.com/”> Computertaleem.com</a>

</body>

</html>

Nothing special going on here at all. You see that the page which we have opened here is an un-styled page.

Actually, what is happening here? Actually, I want to explain that the file you have opened in the browser that web browser is applying its own default style.

You can notice that the result of formatting that you see here in the browser, so font colour is black, Text is bold and italic and with heading also, the colour of the link is blue.

CSS Default Browser Style

The space between paragraphs and headings the browser default styling is controlled all of that there might be a slight difference between one browser and other for the most part.

Now you notice actually how this is happening. How web browser renders its own style we can also change these settings.

To See the Web-Browser Style. (Mozilla Firefox).

  • Tools.
  • Options.
  • Contents.

mozilla Contents

Here I can change which default font I want to use by clicking on the Advanced button.

fonts

When you apply any option then you can see changes has been made in the browser.

similarly, If you change the size also changes will be affected in the web browser.

If you want to change the text colour, background colour, and link colour, click on the colour button.

 colors

The mean of the above opening file in any browser is that when you open any unstyled file then the browser applies its style.

So what point I mean to show you. Well to make sure, you focus on very fundamentals truth of CSS when you begin to write styles.

It is really important to understand it. As you author your own style sheet you just not defining what you want to look page element look you are going to be overwriting the browser default styling.

  CSS Editor Features.

  • Line Numbers.
  • Code Formatting Options.
  • Syntax highlighting.
  • Multi-language Support.

Do You Need a New Tool Just For CSS?

  • If you already use a dedicated HTML editor, you probably do not need to change and work with it.
  • More you can get information about CSS Editors.

 Tracking Browser Support.

  • Nothing beats testing in multiple browsers.
  • If possible, test in Safari, Chrome, Firefox, Opera, and Internet Explorer.
  • Earlier browser version support often differs from current versions.
  • Increasingly, the author needs to test on mobile devices.
Spread the love

About imran

Avatar
My Name Mohammad Ramzan Bhutto. Live in District Jacobabad, Sindh, Pakistan. I have started blogging on Information Technology, my selected areas are Online Business, Digital Marketing, Make Money Online.

Check Also

External Style Sheet

How to Use External Style Sheet. 

How to Use External Style Sheet. An external style sheet is simply texting files with …