Scribd
Upload
7 views3 pages

Computer Ma Revising Material

The document provides a comprehensive guide on HTML and CSS formatting techniques, including how to set background images, create ordered and unordered lists, and format tables. It covers various list styles, table structures, and CSS properties for styling elements such as colors, borders, and padding. Additionally, it explains the use of description lists and the layout properties for tables in HTML.

Uploaded by

charanm.s
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
7 views3 pages

Computer Ma Revising Material

The document provides a comprehensive guide on HTML and CSS formatting techniques, including how to set background images, create ordered and unordered lists, and format tables. It covers various list styles, table structures, and CSS properties for styling elements such as colors, borders, and padding. Additionally, it explains the use of description lists and the layout properties for tables in HTML.

Uploaded by

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

COMPUTER MA REVISING MATERIAL

Charan 8E

body{background-image: url(file:///C:/Users/Admin/Desktop/flower.jpg)}
–(works in windows notepad)
Or
body{background-image:url(flower.jpg)}
Or
body{background-image:url(image address)}

(flower: image name)


(.jpg:image format)
(Admin:User)

<ol start=3 reversed>


Will give lists starting from 3 and going down- 3, 2, 1 and so on

<ol style=list-style-type:lower-roman>
(lower-roman/upper-alpha)
-changes the format of the ordered list pointing

<li style=color:darkgreen>
(darkgreen or any color that is recognised by the HTML language) .ML
-changes color of THAT <li> POINT LINE ONLY

ul{list-style-type:circle;}
(circle/disc/square)
-changes the shape of the bullet point for unordered lists

<ol type='A'> - Capital letters *A, B, C*


<ol type='a'> - small letters *a, b, c*
<ol type='I'> - Capital Roman numbers *I, II, III*
<ol type='i'> - small Roman numbers *i, ii, iii*
<ol type='1'> - sequence of numbers(default) *1, 2, 3*

<ul style=lists-style-position:outside> - has the list points near the margin


<ul style=lists-style-position:inside> - has the list points far away from the margin
<ol style=lists-style-position:outside> - has the list points near the margin
<ol style=lists-style-position:inside> - has the list points near the margin
<dl> </dl> (description list)
<dt> (description title)
<dd> (description details)

<caption> </caption> (heading of a table) or (short description of the table)


Headings: special cells that act as labels for the type of info in each column
Cell: intersection of a row and a column
Columns: property of an object or called field
Rows: represents values of all fields in a table, also called record

<table> </table> (to create a table in HTML)


<tr> </tr> (mark the beginning and end of a row)
<td> </td> (a cell in each column is defined with these tags)
<th> </th> (specify a column heading)

Table,th,td{border:1px solid blue}


-(makes the borders of the table)
-(this syntax should be inside the <style> and </style> tag)

table{border-spacing:10px;width:100%}
th,td{border:1px solid teal;padding:10px;text-align:left}
th{background-color:RGB(12,414,212)}
tr:hover{background-color:RGB(112,32,143)}
-(these are other formatting and editing the codes for a table)

Padding: (space between border and text inside the cell)


hover : (creates a highlighting animation when cursor is hovering above)

{text-align:left}
- defines at which side the text appears inside a cell
{vertical-align:middle}
- defines if the text is at the top,middle or bottom of the cell

table{table-layout:fixed}
- layout(fixed|auto|initial)
Fixed:column width depends on the table width and the width of the columns not the content of
the cells
Auto: width of column is automatically set to the maximum contents in the column cell
Initial: the default is used for column width

{border-spacing}
- space between borders of cells and table

→horizontal/vertical {border-spacing: 10px 20px}


table{border-collapse:separate}
- separate|collapse
- separate(has space between borders where we define the border spacing)
- collapse(has no space between borders and the border is a single line/detached)

Caption{caption-side:bottom}
- top(default)|bottom

<table style=empty-cells:hide>
- hide|show
- hide(empty-cell without border)
- having a cell but no info(border around empty-cell)

You might also like