Chapter 1 : Introduction to CSS

           , , , , , , , ,      22 comments   
Learn CSS, CSS Tutorial,Easy CSS, Easily Learn CSS

CSS is an abbreviation for cascading style sheet. It is now widely being used by every website designer or developer.

Bloggers are also modifying the design or look of their online blog pages. This is also called the Style Sheet. You will learn in depth study about style sheet and its all 3 types with the uses. CSS Basic Tips is a blog to help other bloggers and it is a channel partner with BloggingFunda - A Community of Bloggers.

You can use style sheet with three different ways.
  1. Inline Style Sheet
  2. Internal or Embedded Style Sheet
  3. External or Linked Style Sheet
You can use style sheet with three different ways.
  • CSS stands for Cascading Style Sheets
  • CSS defines how HTML elements are to be displayed
  • Styles were added to HTML 4.0 to solve a problem
  • CSS saves a lot of work
  • External Style Sheets are stored in CSS files
While dealing with formatting your website, you have some choices of how to use the CSS, either internally or externally.

As discussed above, a style sheet has three syntax of writing.

Internal Stylesheet

First we will understand and learn the internal method of css. This way you are simply placing the CSS code between the open <head> and close </head> tags of each HTML file you want to style with the CSS. 

The format for this is shown in the example below:-


 <html>
 <head>
  <style type="text/css">
   p
   {
     background-color:#ff2354;
   }
  </style> 
 </head>
 <body>
  <p>This is with Internal Stylesheet.</p>
 </body>
 </html>


External Stylesheet

In this example, you have to write your style sheet in other file instead of writing between the <head></head> tags. 

 And once you are done with your external css file, just call that file with the <link> tag as in below example.
 <html>
 <head>
  <link rel="stylesheet" href="style.css" type="text/css">
 </head>
 <body>
  <p>This is with External Stylesheet.</p>
 </body>
 </html>

 Inline Stylesheet
In this example, you have to write your style sheet in any of the HTML tag. This is intended to highlight of format the selected part of the text.

 <html>
  <body>
  <p style="background-color:#ff2354;">
    This is with External Stylesheet.
  </p>
 </body>
 </html>
I have easily explained all the types of stylesheet and now if you want to explore the amazing world of styles with the help of stylesheet then go through the other chapters written by cssbasictips blog.

NOTE:- To use these properties and relevant values of Position Attribute, read posts on each topic in the next section of this blog.

 You can also check these example codes in the online editor by CSSBASICTIPS.

22 comments:

  1. UnknownSeptember 5, 2015 at 3:47 AM

    Thanks for sharing this wonderful post as this is what I was searching on the net. This CSS tutorial is good for beginners like me. I am new to website designing even I am new to computers and don't know much about CSS.

    I have taken coaching for HTML and stylesheet but my teacher did not give any example of his own. He ever point us towards already created examples online.

    But I find this tutorial very very helpful for me and all other who are seeking help from the very basic level of CSS stylesheet.

    Once again, thanks for sharing such a wonderful and helpful tutorial.

    Gagan Khaira

    ReplyDelete
    Replies
    1. Mohinder Paul VermaSeptember 5, 2015 at 4:37 AM

      Thanks Gagan for this appriciation. I promise you that in near future I will be writing more and more lessons with proper and easy examples of css bases coding.

      If you have any doubt or you need any kind of help in style sheet coding, do let me know.

      Thanks for stopping by.

      Delete
  2. UnknownSeptember 7, 2015 at 4:27 AM

    This is the perfect place to learn CSS from the very beginning, in fact if one want to learn basics of css, he must learn the basic syntax of style sheet and this is available on CSS Basic Tips. And that is this blog.

    Thanks for sharing this helping blog for all.

    ReplyDelete
    Replies
    1. Mohinder Paul VermaSeptember 7, 2015 at 5:58 AM

      Thanks Dear Balwinder for this encouraging comment on my blog post and I hope that you will support me and my blog like this in future too.

      It is just a start and soon I will be implementing the look of this blog to make it like a professional blogger. till then stay focused and give your valuable feedback.

      Once again thanks for sharing such a lovely review about this blog.

      Delete
  3. AnonymousSeptember 9, 2015 at 3:57 AM

    Hi Mohinder Paul Verma, This is my first visit on your blog and one of my friend searched about it. But let me tell you frankly that this is very tough for him to search your blog. Do some SEO for your blog and get huge traffic from google organic search.

    You are doing a commendable job and you deserve to be number one in search. I am also learning basics of CSS from your easy to understand blog posts.

    ReplyDelete
    Replies
    1. Mohinder Paul VermaSeptember 26, 2015 at 1:28 AM

      Hi Dear

      Thanks for stopping by and I appreciate you found this blog worthy. But dear, you must write your name so that I can use your name in this comment.

      Once again thanks for sharing your valuable feedback.

      Delete
  4. AnonymousSeptember 9, 2015 at 4:01 AM

    Thanks for sharing this wonderful post as it is from scratch of CSs style sheet and I am learning and also enjoying. This is the number one blog to teach style sheet from the very basic.

    http://cssbasictips.blogspot.in/2015/09/introduction-to-css.html?showComment=1441796266600#c4785946588210645731

    ReplyDelete
    Replies
    1. Mohinder Paul VermaSeptember 29, 2015 at 12:40 AM

      Thanks Jagseer for this appreciation and it will surely encourage me to write more tips and trick about style sheet.

      For your information, I am preparing the best ever content about CSS and soon it will be published on this blog.

      So, stay alert. Thanks

      Delete
  5. UnknownSeptember 10, 2015 at 10:17 PM

    Hi Mohinder Paul Verma

    This is my first visit on your blog and it sound good to learn CSS style sheet from the very basic. Actually every one is learning style sheet but you are offering CSS syntax and its uses from the beginning.

    I have bookmarked your blog and shows to my friends who are also learning style sheet from the institute. My teacher also recommend your blog to the absolutely new to stylesheet.

    Thanks a lot for sharing such a wonderful and helpful blog.

    ReplyDelete
  6. UnknownSeptember 10, 2015 at 10:21 PM

    Hi Mohinder Paul I am a new to style sheet and one of my friend find your blog on the internet. He shared basic css tips with all my friends who are doing computer engineering and style sheet is one subject in our curriculum.

    We all found your blog helpful. Thanks for sharing this a wonderful and helpful blog.

    ReplyDelete
    Replies
    1. Mohinder Paul VermaSeptember 29, 2015 at 12:44 AM

      Thanks Sukhchain for stopping by and commenting on this post. Trust me this will help me to write more and more useful tips and trick about CSS.

      Have a nice day

      Delete
  7. UnknownSeptember 21, 2015 at 7:02 AM

    This is my first visit on this blog but it seems that you have created a mini eBook for all who want to learn CSS from the very first lesson and that is the syntax of CSS.

    I am a computer science student and a very small portion of style sheet is in our syllabus, if I did not find your blog then I have to take coaching but I am not in the position to bear coaching fees.

    Thanks for sharing such a wonderful and helpful post.

    ReplyDelete
    Replies
    1. Mohinder Paul VermaSeptember 29, 2015 at 12:47 AM

      Thanks Mandeep for your visit and kind words about my blog post. If you feel that you should learn it online from me, do let me know because I teach all computer courses online to other students. If you are interested, give comment or email me at the following email id for further discussion on this topic.

      Once again thanks for stopping by and prasing.

      My email ID: mohinder.verma@aitcc.in

      Delete
  8. UnknownSeptember 25, 2015 at 3:34 AM

    I am a computer literate but did not find anything on the net that is providing information about any topic from the scratch. You created this blog to help all CSS lovers and I found it helpful when I was designing my online portal for my customers.

    Thanks for sharing this wonderful and helpful information.

    ReplyDelete
    Replies
    1. Mohinder Paul VermaSeptember 29, 2015 at 12:49 AM

      Thanks Narinder for this much appreciated words. I am glad that this blog helped you in designing your online postal for your customer.

      If you face any problem or difficulty, do let me know, I will surely help you out.

      Once again thanks for your kind visit and comment also.

      Delete
  9. UnknownSeptember 25, 2015 at 7:21 AM

    Hi Mohinder Verma

    This is Virat Sharma from Punjab (India). First of all I would like to give thanks to you for creating a blog with such a wonderful and easy to understand language about teaching CSS. This is very helpful for new bloggers like me and all other who are new to blogging and don't know much about style sheet.

    Now I can change the style sheet section my blog template. I will share with your when it will be completed.

    Once again thanks for sharing this wonderful blog.

    ReplyDelete
  10. UnknownSeptember 25, 2015 at 11:30 PM

    Hi
    this is my first visit and I don't know how to express my feelings about this super helpful blog. Thanks for sharing such a wonderful and helpful blog.

    I am a computer engineering student and there is one subject about style sheet and i found your blog a stepping stone for all who want to make a solid base in CSS.

    Thanks a ton for sharing this blog.

    ReplyDelete
  11. Parwinder KaurSeptember 29, 2015 at 12:32 AM

    Thanks dear for sharing CSS tips but sorry to say but this is not the one blog that everyone is appreciating because there are lots of blogs which are offering detailed information from the very beginning.

    This blog is also offering same information that other blogs are offering but there is nothing any uniqueness present in this blog.

    ReplyDelete
    Replies
    1. Mohinder Paul VermaSeptember 29, 2015 at 12:38 AM

      Thanks dear Parwinder for your genuine feedback and can you please brief your experience about my blog so that I can try to rectify the issue faced by you or I can add more relevant informaon to make this blog a unique blog.

      But let me tell you one thing that, till now only syntax about whole CSS is published and rest is still left and I am preparing the content to publish.

      I assure you that the next content will give you more helpful tips and trick that no other blog is offering freeware.

      Once again thanks for your feedback.

      Delete
  12. UnknownOctober 15, 2015 at 4:48 AM

    I think now you must write posts about rach chapter for an example. All chapters are interesting and helpful in understanding syntax of css.

    ReplyDelete
  13. UnknownOctober 24, 2015 at 12:14 AM

    It seems that most of the new css learning users are following this blog and it is good for both. I am also a newbie and learning the web to find the most relevant information.

    Thanks for sharing your knowledgeable bits of style sheet.

    ReplyDelete
  14. sukhwinder singhJuly 1, 2017 at 2:32 AM

    sir it is real useful thing for new lerners. thanks

    ReplyDelete