Scribd
Upload
3 views

10. CSS

The document provides an overview of CSS, XML, and JSON, explaining their definitions, uses, and differences. It details CSS selectors, ways to insert CSS, and the distinctions between HTML and XML. Additionally, it highlights the advantages of JSON as a lightweight data interchange format compared to XML.

Uploaded by

bhanu
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
3 views

10. CSS

The document provides an overview of CSS, XML, and JSON, explaining their definitions, uses, and differences. It details CSS selectors, ways to insert CSS, and the distinctions between HTML and XML. Additionally, it highlights the advantages of JSON as a lightweight data interchange format compared to XML.

Uploaded by

bhanu
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 7

Date:03/Jan/2023

----------------

CSS

---

- CSS stands for Cascading Style Sheets

- CSS describes how HTML elements are to be displayed on browser screen

- CSS saves a lot of work

Ex:

<html>

<head>

<style>

p{

text-align : center;

</style>

</head>

<body>

<p>I am paragraph1</p>

<p>I am paragraph2</p>

....

<p>I am paragraph10</p>

</body>

</html>

Refer program CSS1.html


CSS Selectors

-------------

- element selector

- the styles are given to the specific HTML elements only

Ex:

h3 {

text-align : center;

color : red;

- id selector

- the id selector uses the id attribute of a HTML element to select a

specific element

Refer program CSSId.html

- class selector

- the class selector selects elements with a specific class attribute

- the class selector restricts that the styles need to be used by the specific

HTML element only

Refer program CSSClass.html

- grouping selector

Ex:

h3 {

text-align : center;

color : blue;

}
h4 {

text-align : center;

color : blue;

p {

text-align : center;

color : blue;

After grouping,

h3 , h4, p {

text-align : center;

color : blue;

Ways of Inserting CSS

---------------------

- Internal Style Sheets

- the styles are defined using <style> tag in <head> section

- the styles are used only within the same HTML file

- all above programs are internal

- Inline Style Sheets

- the styles are defined using "style" attribute along with the HTML element

- the styles are used only within the same HTML element

Refer program CSSInline.html


- External Style Sheets

- the styles are defined in an external CSS file

- the styles are used in other HTML files

Refer programs

- mystyle.css (external CSS file)

- externalCSS.html

XML

---

- XML stands for Extensible Markup Language

- XML is used to transport the data from one application to another application

- In Java, XML is used to create configuration files required for the application

HTML vs XML

-----------

- In HTML, all tags are predefined tags where as in XML all tags are used defined tags

- HTML is used to present the data where as XML is for data about data (META-DATA)

Ex:

<b>5000</b> => HTML - 5000 is presented as bold

<salary>5000</salary> => XML - 5000 is salary

- HTML is not case sensitive where as XML is case sensitive

<salary>5000</Salary> => error

- HTML is not standard where as XML is standard


Valid XML

---------

- A XML file should contain only one root tag (the first tag in XML file is root tag)

- For every tag there should be a closing tag or self enclosing tag

Ex:

<mytag>...</mytag>

or

<mytag/> => self enclosing tag

- Attribute values should be in either " " or ' '

Ex:

<property name="salary" value='5000'/>

- No overlapping of tags

Ex:

<employee><salary>5000</employee></salary> => error - overlapping tags

REfer program library.xml

JSON

----

- JSON stands for JavaScript Object Notation

- JSON is light weight data interchange format

- JSON is easy to read and write than XML


- JSON is language independent

- JSON is open standard for exchanging data on the web

- In JSON, data is represented in key-value pairs enclosing in between {} braces

Refer program library.json

You might also like