uptu web technology unit 2 html
- 1. Web Technology (NCS-504) Prepared By Mr. Abhishek Kesharwani Assistant Professor,UCER Naini,Allahabad
- 2. HTML Images • In HTML, images are defined with the <img> tag. • The <img> tag is empty, which means that it contains attributes only, and has no closing tag. • To display an image on a page, you need to use the src attribute. Src stands for "source". The value of the src attribute is the URL of the image you want to display
- 3. HTML Images <img src="url" alt="some_text“ width="304" height="228"> The URL points to the location where the image is stored. alt attribute specifies an alternate text for an image, if the image cannot be displayed. The height and width attributes are used to specify the height and width of an image.
- 4. HTML Tables • Tables are defined with the <table> tag. • A table is divided into rows (with the <tr> tag), and each row is divided into data cells (with the <td> tag). td stands for "table data," and holds the content of a data cell. A <td> tag can contain text, links, images, lists, forms, other tables, etc. • To display a table with borders, specify the border attribute.
- 5. • Header information in a table are defined with the <th> tag. • All major browsers display the text in the <th> element as bold and centered. • Use rowspan to span multiple rows merging together table rows and colspan to span across multiple columns. • cellpadding attribute determines how much space will exist between a table cell border and the elements contained within it. • cellspacing determines how much space will exist between each table cell.
- 7. <table border="1"> <tr> <td><b>Column 1</b></td> <td><b>Column 2</b></td> <td><b>Column 3</b></td> </tr> <tr> <td rowspan="2">Row 1 Cell 1</td> <td>Row 1 Cell 2</td> <td>Row 1 Cell 3</td> </tr> <tr> <td>Row 2 Cell 2</td> <td>Row 2 Cell 3</td> </tr> <tr> <td colspan="3">Row 3 Cell 1</td> </tr> </table>
- 8. Output
- 9. <table border="1" cellpadding="10“ > <tr> <td><b>Column 1</b></td> <td><b>Column 2</b></td> </tr> <tr> <td>Row 1 Cell 1</td> <td>Row 1 Cell 2</td> </tr> <tr> <td>Row 2 Cell 1</td> <td>Row 2 Cell 2</td> </tr> </table>
- 10. HTML Lists • HTML lists appear in web browsers as bulleted lines of text. There are actually three different types of HTML lists, including unordered lists (bullets), ordered lists (numbers), and definition lists (think: dictionaries). • The actual list tags themselves, such as <ul>, are nothing but container elements for list items (<li>)
- 11. html - unordered lists • An unordered list (<ul>) signifies to a web browser that all list items contained inside the <ul> tag should be rendered with a bullet preceding the text. • The default bullet type for most web browsers is a full disc (black circle), but this can be adjusted using an HTML attribute called type.
- 12. html - unordered lists <ul> <li>Milk</li> <li>Toilet Paper</li> <li>Cereal</li> <li>Bread</li> </ul>
- 13. HTML Unordered List Type • <ul type="square"> • <ul type="disc"> • <ul type="circle">
- 14. html - ordered lists • An ordered list is defined using the <ol> tag, and list items placed inside of an ordered list are preceded with numbers instead of bullets. • The numbering of an HTML list can be changed to letters or Roman Numerals by once again adjusting the type attribute. • The start attribute allows you to further customize an HTML ordered list by setting a new starting digit for the ordered list element.
- 15. HTML Numbered List Start Attribute <ol type=“a” start="4" > <li>Buy Food</li> <li>Enroll in College</li> <li>Get a Degree</li> </ol> <ol type="a“> <ol type="A"> <ol type="i"> <ol type="I">
- 16. html - definition term lists HTML definition lists (<dl>) are list elements that have a unique array of tags and elements; the resulting listings are similar to those you'd see in a dictionary. • <dl> - opening clause that defines the start of the list • <dt> - list item that defines the definition term • <dd> - definition of the list item