Skip to main content

What is CSS?

Cascading Style Sheet (CSS),it defines the styles for HTML elements or how an HTML element to displayed.

 There are three ways to use CSS in an HTML file.
  •    Inline CSS
    • by using a style attribute with html tag
  •    Internal CSS
    • using a <style> element in the HTML <head> section
  •    External CSS
    • using one or more external CSS files


Inline CSS Example


<html>

 <body style="background-color:lightgrey">

 <h2 style="color:red">Hello</h2>

 </body>

 </html>

So here we used the style as inline for the <body> and <h1>element.Remember the syntax for inline,

style="property:Value"
If you want to give multiple property's just separate by a semicolon(;).

Internal CSS
  • Internal - using a <style> element in the HTML <head> section
<html>
<head>
<style>
body {background-color:lightgrey}                   
 **changes the background color to grey
h1   {color:blue}
p    {color:green}
</style>
</head>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
</body>
</html>
If we need to identify an element uniquely use an id attribute with element.
To apply style for the corresponding id, use ‘#idname’ in style part.

<style>

body{background-color:lightgrey;}

#div1,#div2{color:red;               
     font-size:20px;
     background-color:pink;}

**applying same style for div 1 and 2 by using id(#div1 #div2)
**use a # symbol followed by id name inside the style tag
**any name you can use without starting with a number.

#div3{background-color:yellow;}   
          
**here #div3 is the id name of the third div

</style>
</head>

<body>
hello
<div id="div1"> hello its a test</div>
<div id="div2"> hello its a div test</div>
<p> hello just an example</p>

<div id="div3" > new div</div>

</body>

External CSS
  • External - using one or more external CSS files
All the css codes are keeping in an external file and save it by .css format (style.css)
Same css style can apply to multiple html pages.
Link to the required html file by following tag and attribute
<link rel=”stylesheet” href=”styles.css”>

href= “cssfilename” //general format.


Comments

Post a Comment

Popular posts from this blog

Java Tutorial Part 5

Keywords Keywords are the predefined words in a program,we can't alter the meaning of keywords. Ex:- for,do,if,class,public. There are almost 62 keywords are in java Identifiers Which is used to give name for a variable or class or methods. Rules for a valid identifier are, *identifiers name must need to begin with an alphabet not by a number.(i.e. 1name is invalid name1 is valid) *Keywords will not be an identifier *Case sensitive, upper case and lower case are treated differently (if you have a variable HELLO and hello, system will treat both in differently)
Post a Comment
Read more

Basic Computer Shortcuts

Ctrl+C : Copies selected content. Ctrl+V : Pastes copied content Ctrl+X : Cut's selected content Ctrl+Z : undo the previous action Ctrl+Y : redo the action you undid Ctrl+A : Selects whole content Ctrl+P : print Windows Logo key( )+Down Arrow : Minimizes the window. Windows Logo key( )+Up Arrow : Maximizes the window. Windows Logo key( )+Left/Right Arrow : To compare two windows. While pressing the Windows logo key  , click the Right Arrow key or the Left Arrow key and your browser will slide over to one side. Select another window (such as a Word document) and use the shortcut only with the opposite arrow. Windows Logo key( )+L  : Locks your computer Windows Logo key( )+P : Presentation display mode Windows Logo key( )+Plus(+)/Minus(-)  : Zoom In and Zoom Out Windows Logo key( )+F : Search for a file Windows Logo key( )+F1 : help Ctrl+Shift+Esc : To open Task Manager
Post a Comment
Read more

Java Tutorial Part 3 (Features of Java)

Simple: Java is designed to be easy to learn. syntax is based on C++ Object Oriented:   In Java, everything is an Object. Java can be easily extended since it is based on the Object model Platform independent:   Java code can be run on multiple platforms  Unlike many other programming languages including C and C++, when Java is compiled, it is not compiled into platform specific machine, rather into platform independent byte code. This byte code is distributed over the web and interpreted by virtual Machine (JVM) on whichever platform it is being run.   Secure:   With Java's secure feature it enables to develop virus-free, tamper-free systems.  Java program cannot harm other system thus making it secure Java provides secure way to access web applications Java provides secure means of creating internet applications Robust Java encourages error free programming by being strictly typed and performing compile time and ru...
Post a Comment
Read more