Downloaded 30 times
Uploaded byPhúc Đỗ
02. session 02 working with html elements
The document discusses various HTML elements. It explains basic formatting elements, color properties, phrase elements, and the image and hyperlink elements. The image element can create image maps with multiple clickable areas linked to different URLs. Phrase elements like CODE, DFN and EM emphasize or format text in specific ways. Hyperlinks are created using the HREF attribute and can link to other pages, emails or locations within the page.
More Related Content
Similar to 02. session 02 working with html elements
![Governance, Deployment & Methodologies for Agentic Automation [2/3]](https://cdn.slidesharecdn.com/ss_thumbnails/agenticcommunityseries-day2-251112135038-a386476d-thumbnail.jpg?width=640&height=640&fit=bounds)
02. session 02 working with html elements
- 1. Working with HTMLElements Session 2
- 2. Contents Explain thebasic formatting elements. Explain the color properties. Explain the phrase elements. Explain the image element. Explain hyperlinks. Building Dynamic Websites/Session 2/ of 28
- 3. Basic text elementsProviding a flow to the contents. Making the web page comprehensible. P BR HR H1 – H6 PRE Building Dynamic Websites/Session 2/ of 28
- 4. Heading levels <!DOCTYPEHTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <HTML><HEAD> <TITLE>Search engines</TITLE> <BODY> <H1>H1 Heading</H1> <H2>H2 Heading</H2> <H3>H3 Heading</H3> <H4>H4 Heading</H4> <H5>H5 Heading</H5> <H6>H6 Heading</H6> </BODY> </HTML> Building Dynamic Websites/Session 2/ of 28
- 5. Heading level BuildingDynamic Websites/Session 2/ of 28
- 6. Address element Tobe a container element. Enclosed: The address Contact information. A link to the home page. A search string feature. Copyright information. Building Dynamic Websites/Session 2/ of 28
- 7. Address element <!DOCTYPEHTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <HTML><HEAD> <TITLE>Address element</TITLE> <BODY> This is an example of ADDRESS element. <HR/> <ADDRESS> VEST Technologies<BR/> Building 009, West Road<BR/> Canberra<BR/> USA </ADDRESS> </BODY> </HTML> Building Dynamic Websites/Session 2/ of 28
- 8. Address element BuildingDynamic Websites/Session 2/ of 28
- 9. TT element Displayingtext such as telewriter type. <!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <HTML><HEAD> <TITLE>TT element</TITLE> <BODY> TT element renders <TT>teletype</TT> or <TT>monospaced</TT> text. </BODY> </HTML> Building Dynamic Websites/Session 2/ of 28
- 10. TT element BuildingDynamic Websites/Session 2/ of 28
- 11. Character entity BuildingDynamic Websites/Session 2/ of 28 Symbol name Entity name Entity number Ampersand (&) & & Greater than (>) > > Less than (<) < < non-breaking space   Quotation mark (“ “) " "
- 12. Basic formatting BBIG I SMALL U Building Dynamic Websites/Session 2/ of 28
- 13. Update and Shitingtext DEL INS STRONG SUB SUP Building Dynamic Websites/Session 2/ of 28
- 14. Color property Thecolor name is listed to validate and process with HTML page. The color property specifies one of these colors to be applied to the textual content. Building Dynamic Websites/Session 2/ of 28
- 15. Color property BuildingDynamic Websites/Session 2/ of 28 Color Hexadecimal Value Aqua #00FFFF Fuchsia #FF00FF Gray #808080 Maroon #800000 Navy #000080 Olive #808000 Purple #800080 Silver #C0C0C0 Teal #008080
- 16. Phrase elements Thereare certain phrase elements. Displaying a program code in different font emphasizing with a different look. Building Dynamic Websites/Session 2/ of 28
- 17. Phrase elements BuildingDynamic Websites/Session 2/ of 28 Element Description CODE Displaying the computer program. DFN Displaying the defination of a term. EM Emphasizing the enclosed text SAMP Displaying a sample output of computer programs. VAR Displaying a variable name that refers to a block of memory and holds a value which is referred by the variable name.
- 18.
- 19. Phrase elements <!DOCTYPEHTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <HTML><HEAD> <TITLE>Phrase Elements</TITLE> <BODY> <H3>Microsoft Excel</H3><HR/> Microsoft Excel: <DFN>is the spreadsheet program.</DFN> <P><CODE>=SUM(first cell address:last cell address)</CODE> is the function that add values appearing in the given cell range.<BR/> Building Dynamic Websites/Session 2/ of 28
- 20. Phrase elements The<EM>first cell address</EM> is the address of the starting the cell from where you want to start the addition operation. The <EM>last cell address</EM> is the address of the last the cell till where you want to add the values.<BR/> The <CODE>SUM</CODE> function adds all numeric values existing in the cells between the first cell and the last cell.</P> An example of <CODE>SUM</CODE> function: <SAMP>=SUM(A1:A3)</SAMP> </BODY> </HTML> Building Dynamic Websites/Session 2/ of 28
- 21. Phrase elements BuildingDynamic Websites/Session 2/ of 28
- 22. SPAN and DIVelement These element defines a section in a web page. DIV is a block level element. SPAN is an in-line level element. Building Dynamic Websites/Session 2/ of 28
- 23. IMG element SRCWIDTH HEIGHT ALT LONGDESC ALIGN USEMAP Building Dynamic Websites/Session 2/ of 28
- 24. Image maps Thereare diferrent areas that act as links in an image. Map element AREA element Building Dynamic Websites/Session 2/ of 28
- 25. Image maps <!DOCTYPEHTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <HTML><HEAD> <TITLE>Search engines</TITLE> <BODY> <H2>Search engines</H2> <MAP name="searchmap"> <AREA href="http://www.google.com" alt="Google" shape="rect" coords="0,0,170,35"/> <AREA href="http://www.ask.com" alt="Ask" shape="rect" coords="0,28,170,70"/> </MAP> <img src="SearchEngines.JPG" alt="Search Engines" width="286" height="99" usemap="#searchmap"/> </BODY> </HTML> Building Dynamic Websites/Session 2/ of 28
- 26. Image maps BuildingDynamic Websites/Session 2/ of 28
- 27. Hyperlinks HREF HREFLANGNAME TARGET TITLE Building Dynamic Websites/Session 2/ of 28
- 28. Summary Basic textelements providing a flow to the contents. Address element enclosed the contact information. W3C defined 16 color name for HTML. Phrase elements display code in different font emphasizing with a different look. There are diferrent areas that act as links in an image. Mailto link allows sending emails Building Dynamic Websites/Session 2/ of 28