The document provides an overview of HTML (Hypertext Markup Language) and web page development. It defines HTML as a markup language used to describe web pages and structure documents to be displayed in a web browser. It discusses the basic HTML elements and tags used to structure content, add formatting, create links and lists, and embed images. It also covers important concepts like testing pages across browsers and platforms.
HTML is a markup language used to define the structure and layout of web pages. It uses tags like <h1> for headings and <p> for paragraphs to structure content. Key HTML elements include:
<html> - defines an HTML document
<head> - contains meta information about the page
<body> - contains visible page content
<a> - defines hyperlinks
<img> - embeds images
<ul>, <ol>, <li> - define unordered, ordered and list item elements
<table> - defines a table with <tr> for rows and <td> for cells
HTML is a markup language used to structure and present content on the web. It stands for Hypertext Markup Language and was created by Tim Berners-Lee in 1991. Some key elements of HTML documents include tags, attributes, and basic building blocks like the <html>, <head>, <title>, and <body> tags. Common tags in HTML are used for formatting text and include headings, paragraphs, breaks, fonts, and lists.
HTML is used to design web pages and is not a programming language. It uses tags like <h1> and <p> to structure and style text content. Common tags are used to create headings, paragraphs, lists, links, and tables. Forms allow users to enter interactive content through elements like text boxes and buttons. Overall, HTML provides the building blocks for displaying structured documents on the web.
Learn HTML and CSS in few steps . Practice an hour daily for good results in 10 days.
Here I am mentioning basic elements , attributes and tags of HTML with styling them
HTML allows users to create web pages. It uses tags to format text, add images and other multimedia, and create hyperlinks. Some key points:
- HTML was created by Tim Berners-Lee in 1989 and standardized in 1997.
- It uses tags enclosed in angle brackets like <p> to format text into paragraphs.
- Common tags include <h1> for main headings, <img> to add images, and <a> for hyperlinks.
- Tables, lists, and forms can be added using <table>, <ul>/<ol>, and <form> tags.
- HTML pages are plain text files that can be viewed on any browser.
HTML is the most widely used language to write web pages. It is a markup language that uses tags to structure text and multimedia content. Some key HTML elements include <head>, <title>, <body>, <p>, <img>, <table>, and <div>. HTML allows embedding of images, hyperlinks, lists, tables, forms, iframes and other interactive elements to create dynamic and engaging web pages. While HTML provides structure and layout, additional technologies like CSS and JavaScript are needed for advanced formatting and interactivity.
HTML is a markup language used to define the structure and layout of web pages. It uses tags like <h1> for headings and <p> for paragraphs to structure content. Key HTML elements include:
<html> - defines an HTML document
<head> - contains meta information about the page
<body> - contains visible page content
<a> - defines hyperlinks
<img> - embeds images
<ul>, <ol>, <li> - define unordered, ordered and list item elements
<table> - defines a table with <tr> for rows and <td> for cells
HTML is a markup language used to structure and present content on the web. It stands for Hypertext Markup Language and was created by Tim Berners-Lee in 1991. Some key elements of HTML documents include tags, attributes, and basic building blocks like the <html>, <head>, <title>, and <body> tags. Common tags in HTML are used for formatting text and include headings, paragraphs, breaks, fonts, and lists.
HTML is used to design web pages and is not a programming language. It uses tags like <h1> and <p> to structure and style text content. Common tags are used to create headings, paragraphs, lists, links, and tables. Forms allow users to enter interactive content through elements like text boxes and buttons. Overall, HTML provides the building blocks for displaying structured documents on the web.
Learn HTML and CSS in few steps . Practice an hour daily for good results in 10 days.
Here I am mentioning basic elements , attributes and tags of HTML with styling them
HTML allows users to create web pages. It uses tags to format text, add images and other multimedia, and create hyperlinks. Some key points:
- HTML was created by Tim Berners-Lee in 1989 and standardized in 1997.
- It uses tags enclosed in angle brackets like <p> to format text into paragraphs.
- Common tags include <h1> for main headings, <img> to add images, and <a> for hyperlinks.
- Tables, lists, and forms can be added using <table>, <ul>/<ol>, and <form> tags.
- HTML pages are plain text files that can be viewed on any browser.
HTML is the most widely used language to write web pages. It is a markup language that uses tags to structure text and multimedia content. Some key HTML elements include <head>, <title>, <body>, <p>, <img>, <table>, and <div>. HTML allows embedding of images, hyperlinks, lists, tables, forms, iframes and other interactive elements to create dynamic and engaging web pages. While HTML provides structure and layout, additional technologies like CSS and JavaScript are needed for advanced formatting and interactivity.
The document provides information on HTML (Hypertext Markup Language) including common tags, commands, and elements used to structure and style web pages. It describes HTML tags like <head>, <body>, <p>, <b>, <i>, and <img> and how they are used to specify document structure and format text and images. It also covers how to add links, lists, tables, and frames to HTML pages.
This document provides an overview of HTML topics that will be covered in lectures 4, 5, and 6 of a web programming course. It discusses HTML, HTML forms, common HTML tags and their purposes, text formatting tags, images, links, tables, lists, and forms. It also covers iframes, framesets, block and inline elements, the <div> and <span> tags, layouts, and buttons. The document serves as an outline of key HTML concepts and elements that will be explored in more depth during the lectures.
HTML is a markup language used to define the structure and layout of web pages. It uses tags to mark elements like headings, paragraphs, lists, links etc. Basic HTML tags include <h1> for main headings, <p> for paragraphs, <ul> for unordered lists, <ol> for ordered lists, and <a> for links. Links are defined using the <a> tag along with an href attribute specifying the URL. HTML also supports basic text formatting tags like <b> for bold, <i> for italic, and <br> for line breaks. Comments can be added in HTML using <!-- and --> tags.
HTML is a markup language used to create web pages. It uses tags to denote structural elements like headings, paragraphs, lists, and links. Tags are written within angle brackets and indicate how content should be displayed. Common tags include <head> for the document head, <title> for the page title, <body> for the main page content, and <p> for paragraphs. HTML documents are created in a text editor and saved with a .html or .htm file extension.
HTML is the standard markup language used to create web pages. HTML documents are composed of elements like headings, paragraphs, links etc that provide structure and meaning. A web browser reads the HTML tags and displays the page by interpreting the tags. Common HTML elements include headings, paragraphs, images, hyperlinks, tables, forms and lists that are used to structure and layout the content on a web page.
This document discusses various HTML elements for organizing text and lists on web pages. It covers paragraphs, headings from H1 to H6, preformatted text, line breaks, horizontal rules, and different types of lists including numbered, bulleted, and definition lists. It also discusses nesting lists and attributes to control numbering styles and bullet types. The overall purpose is to teach how to work with text and lists in HTML.
HTML (Hypertext Markup Language) is used to create web pages and is the building block of the World Wide Web. It uses tags to define headings, paragraphs, lists, links, and other elements including images, tables, forms, and media. Some key HTML tags include <html> <head> <title> <body> <h1>-<h6> <p> <a> <img> <ul> <ol> <li> <table> <tr> <td>. HTML documents must have an <html> tag which contains <head> and <body> tags where content is placed.
The document discusses HTML common tags and elements used to structure web pages. It explains that HTML files use markup tags to tell browsers how to display content. Common tags include <html>, <head>, <title>, <body> for overall page structure. Other tags format text like <b>, <i>, add links with <a>, and structure lists, tables, and headings. The document provides examples and explanations of how each tag is used to build web pages.
The document provides an introduction to HTML and covers the basics of creating HTML pages including page structure, tags, attributes, formatting text, and comments. It explains key elements like <html>, <head>, <title>, <body>, headings, paragraphs, and lists. It also covers attributes, presentational tags, phrase tags, and the difference between block and inline elements. The document is intended as an introductory workshop on HTML for day one.
This document provides an introduction to HTML (Hypertext Markup Language) and how to create basic HTML pages. It discusses HTML tags like <html>, <head>, <title>, <body>, and <meta> that form the basic structure of an HTML page. It also describes how to use text editors like Notepad to write HTML code and save files with the .html or .htm extension. The document provides examples of creating headings, paragraphs, line breaks and horizontal rules. It covers core HTML attributes and formatting tags to style text.
The document provides an introduction to HTML and HTML5. It discusses various HTML tags like <html>, <head>, <body>, <p>, <h1>-<h6>, <a>, <img>, <table>, <ul>, <ol>, <li>, <form>, <input>, <textarea>, <select> and <button>. It also covers HTML elements like header, footer, colors, frames and the basic structure of an HTML5 document. The document is intended as teaching material for a college course on web programming.
This document provides information on static and dynamic web pages. It defines static web pages as pages that are delivered exactly as stored, while dynamic pages are generated by a web application and can change based on things like time, user, or user interaction. Static pages are quick and cheap to develop but offer less interactivity, while dynamic pages allow for more functionality but are slower and more expensive to develop. The document then provides details on HTML tags like headings, paragraphs, lists, and tables that can be used to structure content on web pages.
This document provides an overview of HTML elements and tags for creating web pages. It discusses common HTML tags like headings, paragraphs, links, images, lists, forms, and tables. It also covers CSS for styling HTML elements and JavaScript for adding interactivity. The document is intended as a tutorial for learning basic HTML.
This document summarizes the key differences between static and dynamic web pages. Static web pages are pre-built pages that display the same content for all users, while dynamic pages are built in real-time based on things like user input or time. Some advantages of static pages are that they are quick and cheap to develop, but they lack personalization and interactivity. Dynamic pages allow for more functional, up-to-date websites but are more expensive to develop and host. The document also provides examples of common HTML tags used to structure pages and add formatting.
The document summarizes Workshop #2 on web development hosted by Sohail Asghar and Saad Mustafa. It covers the basics of HTML, CSS, and JavaScript. For HTML, it discusses basic tags like headings, paragraphs, links, images and lists. For CSS, it explains concepts like selectors, colors, backgrounds, borders, fonts, padding, and margins. For JavaScript, it provides introductions to variables, output, data types, and more.
This document provides an introduction and overview of HTML and related web technologies. It begins with an explanation of the internet and World Wide Web, then defines key concepts like URLs, DNS, IP addresses, and HTTP. It proceeds to explain the difference between server-side and client-side coding. The document then covers the basic structure of an HTML document using tags like <html>, <head>, and <body>. It defines common text-level, structural, and media tags. Finally, it discusses relative vs. absolute links and the default styling applied by browsers.
HTML is a markup language used to define the structure and layout of web pages. It uses tags to annotate text with information about headings, paragraphs, lists, and other elements. The key HTML tags are: <html> to define an HTML document, <head> for metadata, <title> for the page title, <body> to contain the visible page content. HTML allows adding images, links, tables, and forms to pages and is essential for building web pages but has limitations as a presentation language.
HTML provides different types of lists to display items in an organized manner. There are unordered lists for items with no inherent order, ordered lists for step-by-step instructions, and definition lists for name-value pairs. Lists can be nested within each other and customized with different bullet styles. Hyperlinks allow navigation between pages using the <a> tag and href attribute to link text or images to other documents locally or on different websites.
SOCRadar's Aviation Industry Q1 Incident Report is out now!
The aviation industry has always been a prime target for cybercriminals due to its critical infrastructure and high stakes. In the first quarter of 2024, the sector faced an alarming surge in cybersecurity threats, revealing its vulnerabilities and the relentless sophistication of cyber attackers.
SOCRadar’s Aviation Industry, Quarterly Incident Report, provides an in-depth analysis of these threats, detected and examined through our extensive monitoring of hacker forums, Telegram channels, and dark web platforms.
The document provides information on HTML (Hypertext Markup Language) including common tags, commands, and elements used to structure and style web pages. It describes HTML tags like <head>, <body>, <p>, <b>, <i>, and <img> and how they are used to specify document structure and format text and images. It also covers how to add links, lists, tables, and frames to HTML pages.
This document provides an overview of HTML topics that will be covered in lectures 4, 5, and 6 of a web programming course. It discusses HTML, HTML forms, common HTML tags and their purposes, text formatting tags, images, links, tables, lists, and forms. It also covers iframes, framesets, block and inline elements, the <div> and <span> tags, layouts, and buttons. The document serves as an outline of key HTML concepts and elements that will be explored in more depth during the lectures.
HTML is a markup language used to define the structure and layout of web pages. It uses tags to mark elements like headings, paragraphs, lists, links etc. Basic HTML tags include <h1> for main headings, <p> for paragraphs, <ul> for unordered lists, <ol> for ordered lists, and <a> for links. Links are defined using the <a> tag along with an href attribute specifying the URL. HTML also supports basic text formatting tags like <b> for bold, <i> for italic, and <br> for line breaks. Comments can be added in HTML using <!-- and --> tags.
HTML is a markup language used to create web pages. It uses tags to denote structural elements like headings, paragraphs, lists, and links. Tags are written within angle brackets and indicate how content should be displayed. Common tags include <head> for the document head, <title> for the page title, <body> for the main page content, and <p> for paragraphs. HTML documents are created in a text editor and saved with a .html or .htm file extension.
HTML is the standard markup language used to create web pages. HTML documents are composed of elements like headings, paragraphs, links etc that provide structure and meaning. A web browser reads the HTML tags and displays the page by interpreting the tags. Common HTML elements include headings, paragraphs, images, hyperlinks, tables, forms and lists that are used to structure and layout the content on a web page.
This document discusses various HTML elements for organizing text and lists on web pages. It covers paragraphs, headings from H1 to H6, preformatted text, line breaks, horizontal rules, and different types of lists including numbered, bulleted, and definition lists. It also discusses nesting lists and attributes to control numbering styles and bullet types. The overall purpose is to teach how to work with text and lists in HTML.
HTML (Hypertext Markup Language) is used to create web pages and is the building block of the World Wide Web. It uses tags to define headings, paragraphs, lists, links, and other elements including images, tables, forms, and media. Some key HTML tags include <html> <head> <title> <body> <h1>-<h6> <p> <a> <img> <ul> <ol> <li> <table> <tr> <td>. HTML documents must have an <html> tag which contains <head> and <body> tags where content is placed.
The document discusses HTML common tags and elements used to structure web pages. It explains that HTML files use markup tags to tell browsers how to display content. Common tags include <html>, <head>, <title>, <body> for overall page structure. Other tags format text like <b>, <i>, add links with <a>, and structure lists, tables, and headings. The document provides examples and explanations of how each tag is used to build web pages.
The document provides an introduction to HTML and covers the basics of creating HTML pages including page structure, tags, attributes, formatting text, and comments. It explains key elements like <html>, <head>, <title>, <body>, headings, paragraphs, and lists. It also covers attributes, presentational tags, phrase tags, and the difference between block and inline elements. The document is intended as an introductory workshop on HTML for day one.
This document provides an introduction to HTML (Hypertext Markup Language) and how to create basic HTML pages. It discusses HTML tags like <html>, <head>, <title>, <body>, and <meta> that form the basic structure of an HTML page. It also describes how to use text editors like Notepad to write HTML code and save files with the .html or .htm extension. The document provides examples of creating headings, paragraphs, line breaks and horizontal rules. It covers core HTML attributes and formatting tags to style text.
The document provides an introduction to HTML and HTML5. It discusses various HTML tags like <html>, <head>, <body>, <p>, <h1>-<h6>, <a>, <img>, <table>, <ul>, <ol>, <li>, <form>, <input>, <textarea>, <select> and <button>. It also covers HTML elements like header, footer, colors, frames and the basic structure of an HTML5 document. The document is intended as teaching material for a college course on web programming.
This document provides information on static and dynamic web pages. It defines static web pages as pages that are delivered exactly as stored, while dynamic pages are generated by a web application and can change based on things like time, user, or user interaction. Static pages are quick and cheap to develop but offer less interactivity, while dynamic pages allow for more functionality but are slower and more expensive to develop. The document then provides details on HTML tags like headings, paragraphs, lists, and tables that can be used to structure content on web pages.
This document provides an overview of HTML elements and tags for creating web pages. It discusses common HTML tags like headings, paragraphs, links, images, lists, forms, and tables. It also covers CSS for styling HTML elements and JavaScript for adding interactivity. The document is intended as a tutorial for learning basic HTML.
This document summarizes the key differences between static and dynamic web pages. Static web pages are pre-built pages that display the same content for all users, while dynamic pages are built in real-time based on things like user input or time. Some advantages of static pages are that they are quick and cheap to develop, but they lack personalization and interactivity. Dynamic pages allow for more functional, up-to-date websites but are more expensive to develop and host. The document also provides examples of common HTML tags used to structure pages and add formatting.
The document summarizes Workshop #2 on web development hosted by Sohail Asghar and Saad Mustafa. It covers the basics of HTML, CSS, and JavaScript. For HTML, it discusses basic tags like headings, paragraphs, links, images and lists. For CSS, it explains concepts like selectors, colors, backgrounds, borders, fonts, padding, and margins. For JavaScript, it provides introductions to variables, output, data types, and more.
This document provides an introduction and overview of HTML and related web technologies. It begins with an explanation of the internet and World Wide Web, then defines key concepts like URLs, DNS, IP addresses, and HTTP. It proceeds to explain the difference between server-side and client-side coding. The document then covers the basic structure of an HTML document using tags like <html>, <head>, and <body>. It defines common text-level, structural, and media tags. Finally, it discusses relative vs. absolute links and the default styling applied by browsers.
HTML is a markup language used to define the structure and layout of web pages. It uses tags to annotate text with information about headings, paragraphs, lists, and other elements. The key HTML tags are: <html> to define an HTML document, <head> for metadata, <title> for the page title, <body> to contain the visible page content. HTML allows adding images, links, tables, and forms to pages and is essential for building web pages but has limitations as a presentation language.
HTML provides different types of lists to display items in an organized manner. There are unordered lists for items with no inherent order, ordered lists for step-by-step instructions, and definition lists for name-value pairs. Lists can be nested within each other and customized with different bullet styles. Hyperlinks allow navigation between pages using the <a> tag and href attribute to link text or images to other documents locally or on different websites.
SOCRadar's Aviation Industry Q1 Incident Report is out now!
The aviation industry has always been a prime target for cybercriminals due to its critical infrastructure and high stakes. In the first quarter of 2024, the sector faced an alarming surge in cybersecurity threats, revealing its vulnerabilities and the relentless sophistication of cyber attackers.
SOCRadar’s Aviation Industry, Quarterly Incident Report, provides an in-depth analysis of these threats, detected and examined through our extensive monitoring of hacker forums, Telegram channels, and dark web platforms.
Atelier - Innover avec l’IA Générative et les graphes de connaissancesNeo4j
Atelier - Innover avec l’IA Générative et les graphes de connaissances
Allez au-delà du battage médiatique autour de l’IA et découvrez des techniques pratiques pour utiliser l’IA de manière responsable à travers les données de votre organisation. Explorez comment utiliser les graphes de connaissances pour augmenter la précision, la transparence et la capacité d’explication dans les systèmes d’IA générative. Vous partirez avec une expérience pratique combinant les relations entre les données et les LLM pour apporter du contexte spécifique à votre domaine et améliorer votre raisonnement.
Amenez votre ordinateur portable et nous vous guiderons sur la mise en place de votre propre pile d’IA générative, en vous fournissant des exemples pratiques et codés pour démarrer en quelques minutes.
Microservice Teams - How the cloud changes the way we workSven Peters
A lot of technical challenges and complexity come with building a cloud-native and distributed architecture. The way we develop backend software has fundamentally changed in the last ten years. Managing a microservices architecture demands a lot of us to ensure observability and operational resiliency. But did you also change the way you run your development teams?
Sven will talk about Atlassian’s journey from a monolith to a multi-tenanted architecture and how it affected the way the engineering teams work. You will learn how we shifted to service ownership, moved to more autonomous teams (and its challenges), and established platform and enablement teams.
Flutter is a popular open source, cross-platform framework developed by Google. In this webinar we'll explore Flutter and its architecture, delve into the Flutter Embedder and Flutter’s Dart language, discover how to leverage Flutter for embedded device development, learn about Automotive Grade Linux (AGL) and its consortium and understand the rationale behind AGL's choice of Flutter for next-gen IVI systems. Don’t miss this opportunity to discover whether Flutter is right for your project.
UI5con 2024 - Boost Your Development Experience with UI5 Tooling ExtensionsPeter Muessig
The UI5 tooling is the development and build tooling of UI5. It is built in a modular and extensible way so that it can be easily extended by your needs. This session will showcase various tooling extensions which can boost your development experience by far so that you can really work offline, transpile your code in your project to use even newer versions of EcmaScript (than 2022 which is supported right now by the UI5 tooling), consume any npm package of your choice in your project, using different kind of proxies, and even stitching UI5 projects during development together to mimic your target environment.
WhatsApp offers simple, reliable, and private messaging and calling services for free worldwide. With end-to-end encryption, your personal messages and calls are secure, ensuring only you and the recipient can access them. Enjoy voice and video calls to stay connected with loved ones or colleagues. Express yourself using stickers, GIFs, or by sharing moments on Status. WhatsApp Business enables global customer outreach, facilitating sales growth and relationship building through showcasing products and services. Stay connected effortlessly with group chats for planning outings with friends or staying updated on family conversations.
Neo4j - Product Vision and Knowledge Graphs - GraphSummit ParisNeo4j
Dr. Jesús Barrasa, Head of Solutions Architecture for EMEA, Neo4j
Découvrez les dernières innovations de Neo4j, et notamment les dernières intégrations cloud et les améliorations produits qui font de Neo4j un choix essentiel pour les développeurs qui créent des applications avec des données interconnectées et de l’IA générative.
Graspan: A Big Data System for Big Code AnalysisAftab Hussain
We built a disk-based parallel graph system, Graspan, that uses a novel edge-pair centric computation model to compute dynamic transitive closures on very large program graphs.
We implement context-sensitive pointer/alias and dataflow analyses on Graspan. An evaluation of these analyses on large codebases such as Linux shows that their Graspan implementations scale to millions of lines of code and are much simpler than their original implementations.
These analyses were used to augment the existing checkers; these augmented checkers found 132 new NULL pointer bugs and 1308 unnecessary NULL tests in Linux 4.4.0-rc5, PostgreSQL 8.3.9, and Apache httpd 2.2.18.
- Accepted in ASPLOS ‘17, Xi’an, China.
- Featured in the tutorial, Systemized Program Analyses: A Big Data Perspective on Static Analysis Scalability, ASPLOS ‘17.
- Invited for presentation at SoCal PLS ‘16.
- Invited for poster presentation at PLDI SRC ‘16.
8 Best Automated Android App Testing Tool and Framework in 2024.pdfkalichargn70th171
Regarding mobile operating systems, two major players dominate our thoughts: Android and iPhone. With Android leading the market, software development companies are focused on delivering apps compatible with this OS. Ensuring an app's functionality across various Android devices, OS versions, and hardware specifications is critical, making Android app testing essential.
E-commerce Development Services- Hornet DynamicsHornet Dynamics
For any business hoping to succeed in the digital age, having a strong online presence is crucial. We offer Ecommerce Development Services that are customized according to your business requirements and client preferences, enabling you to create a dynamic, safe, and user-friendly online store.
Takashi Kobayashi and Hironori Washizaki, "SWEBOK Guide and Future of SE Education," First International Symposium on the Future of Software Engineering (FUSE), June 3-6, 2024, Okinawa, Japan
What is Master Data Management by PiLog Groupaymanquadri279
PiLog Group's Master Data Record Manager (MDRM) is a sophisticated enterprise solution designed to ensure data accuracy, consistency, and governance across various business functions. MDRM integrates advanced data management technologies to cleanse, classify, and standardize master data, thereby enhancing data quality and operational efficiency.
GraphSummit Paris - The art of the possible with Graph TechnologyNeo4j
Sudhir Hasbe, Chief Product Officer, Neo4j
Join us as we explore breakthrough innovations enabled by interconnected data and AI. Discover firsthand how organizations use relationships in data to uncover contextual insights and solve our most pressing challenges – from optimizing supply chains, detecting fraud, and improving customer experiences to accelerating drug discoveries.
A Study of Variable-Role-based Feature Enrichment in Neural Models of CodeAftab Hussain
Understanding variable roles in code has been found to be helpful by students
in learning programming -- could variable roles help deep neural models in
performing coding tasks? We do an exploratory study.
- These are slides of the talk given at InteNSE'23: The 1st International Workshop on Interpretability and Robustness in Neural Software Engineering, co-located with the 45th International Conference on Software Engineering, ICSE 2023, Melbourne Australia
Transform Your Communication with Cloud-Based IVR SolutionsTheSMSPoint
Discover the power of Cloud-Based IVR Solutions to streamline communication processes. Embrace scalability and cost-efficiency while enhancing customer experiences with features like automated call routing and voice recognition. Accessible from anywhere, these solutions integrate seamlessly with existing systems, providing real-time analytics for continuous improvement. Revolutionize your communication strategy today with Cloud-Based IVR Solutions. Learn more at: https://thesmspoint.com/channel/cloud-telephony
2. Contents
Cascading Style Sheets (CSS)
Forms and Frames
Creating HTML documents
HTML and HTML tags
Introduction to XML
Working with Tables
2
3. What is HTML?
WWW – uses hypertext to cross-reference or link related
resources anywhere on the Internet.
HTML (HyperText Markup Language) used for describing
web pages and display its files (text, or multimedia).
HTML is not a programming language, is a markup
language
Cannot be used to describe computations.
Use to describe the general form and layout of documents
to be displayed by the browser.
Tags describe document content
HTML documents contain HTML tags and plain text
Telling the browser what to do, and what properties to use.
A series of tags that are integrated into a text document.
Compose of “Content” and “Controls”
3
4. What Software is Needed?
Internet software you will need for web authoring includes:
Web browser to view a web page, such as Netscape, Internet
Explorer, Mosaic.
Text editor to create the HTML file; such as Notepad or
WordPad, etc.
FTP (File Transfer Protocol) program to upload a page.
There are several available for a Mac or a PC.
Graphics editor to create new graphics. This is optional. If
you decide you need one there are several available.
4
5. What Steps to Follow?
Creating a page on the Web can be a simple or complex
process. However, the steps are always the same:
Decide what information will be on a page and how that
information will be arranged on the page.
Create the HTML file with the text and commands using
any editor.
Test the page in various browsers and on various
platforms.
Finally, upload the HTML file to the Web server.
5
6. HTML Elements/ Tags
HTML commands or tags are enclosed in angled brackets: <
>.
Some tags stand alone and some come in pairs. In paired
tags the ending tag starts with a slash: /.
Not case-sensitive.
6
Element Attribute Name Attribute Value
<p align=“right”> </p>
7. Types of HTML Tags
six basic types of commands:
Structural tags (mandatory)
Formatting tags
Separator tags
Heading tags
List tags
Link tags
7
8. Cont’d
six basic types of commands:
Structural tags – these are at the beginning and end of
an HTML file.
<HTML> </HTML> For an HTML document
<HEAD> </HEAD> For the head section
<TITLE> </TITLE> For the title of the bookmark
<BODY> </BODY> For the body section
Begins with <html> and ends with </html>
Elements (tags) are nested one inside another:
Example: <TITLE> My Personal Page </TITLE>
8
<html> <head></head> <body></body> </html>
9. Cont’d
six basic types of commands:
Heading tags – there are 6 levels of Headings. Level 1
is the largest font size. Defined with <h1> to <h6> tags
<H1> </H1> Heading level 1
<H2> </H2> Heading level 2
<H3> </H3> Heading level 3
<H4> </H4> Heading level 4
<H5> </H5> Heading level 5
Example: <H2> This is My Personal Page </H2>
9
11. Cont’d
six basic types of commands:
Formatting tags – these tags affect the format of the
word or sentence.
<I> </I> For Italic text
<B> </B> For Bold text
<U> </U> For Underlined text
<STRONG> STRONG </STRONG> For Bold text
<EM> Emphasis </EM> Browsers usually display this as
italics.
11
12. Cont’d
six basic types of commands:
Formatting tags
12
<b></b> bold
<i></i> italicized
<u></u> underlined
<sup></sup> Samplesuperscript
<sub></sub> Samplesubscript
<strong></strong> strong
<em></em> emphasized
<pre></pre> Preformatted text
<blockquote></blockquote> Quoted text block
<del></del> Deleted text – strike through
13. Cont’d
six basic types of commands:
Formatting tags –
Bold, Italic and other Character Formatting Elements
<FONT SIZE=“+2”> Two sizes bigger</FONT>
Normal text size is 3
Color = “#RRGGBB” COLOR attribute of FONT element
E.g., <FONT COLOR=“#RRGGBB”>this text has color</FONT>
Font face – use face attribute
<FONT face=“Times New Roman”> Times New Roman </FONT>
Alignment – some elements have attributes for alignment (ALIGN)
Three alignment values are : LEFT, RIGHT, CENTER.
<CENTER></CENTER> will center elements
13
19. Cont’d
six basic types of commands:
Separators tags – these tags separate words, or
sentences on a page.
<P> Start printing a new Paragraph
<BR> Break; breaks up text onto two lines
<HR> Make a Horizontal Rule (or line)
Example: <P> This is the beginning of the second paragraph
on my Personal Web page.
19
20. Cont’d
six basic types of commands:
Types of Lists – are composed of one or more <LI>
(List Item) elements. There are three main types of lists.
Ordered List (OL) – list of numbered items.
specify a starting number for an ordered list.
<OL TYPE=“1” START=“3”>
20
TYPE Numbering Styles
1 Arabic numbers 1,2,3, ……
a Lower alpha a, b, c, ……
A Upper alpha A, B, C, ……
i Lower roman i, ii, iii, ……
I Upper roman I, II, III, ……
21. Cont’d
six basic types of commands:
Types of Lists
Unordered List (UL) – list of unnumbered items (bullet)
Browsers will usually change list mark in nested lists.
Three bullet types: disc(default), circle, square.
<UL TYPE = “square”>
Definition List (DL) – each item in a DL consists of one or
more Definition Terms (DT elements), followed by one or more
Definition Description (DD elements).
<DL>
<DT> HTML </DT>
<DD> Hyper Text Markup Language </DD>
<DT> DOG </DT>
<DD> A human’s best friend!</DD>
</DL>
21
HTML
Hyper Text Markup Language
DOG
A human’s best friend!
22. Cont’d
six basic types of commands:
Types of Lists
Lists:
<UL> </UL> Make an Unordered List
<OL> </OL> Make an Ordered List
<DL> </DL> Make a Definition List
<LI> Used for each List Item
22
23. Cont’d
Example Tags:
<OL> Here is a list of my hobbies:
<LI> swimming
<LI> hiking
<LI> fishing
</OL>
Example List: Here is a list of my hobbies:
1. swimming
2. hiking
3. fishing
23
24. Cont’d
Links
Hyperlinks are what the Web is all about. Before you
create Hyperlinks, you need to understand URLs.
A URL (Uniform Resource Locator) is a Web address.
Just as you can have two forms of E-mail address, a
long and a short one, you can have two forms of a
URL address.
Absolute URL - complete address. Use this if the link refers
to a page or file on another server (computer).
Relative URL - shortened address, without server name. Use
this if the link is to a page or file on the same server
(computer).
Example Absolute URL:
http://home.netscape.com/training/chapter1.html
Example Relative URL:
24
25. Cont’d
Types of Links – there are two main types of
hyperlinks
Link from the current document to beginning of another
document.
Link from the current document to a specific spot (anchor)
in another document or in the same document.
25
26. Cont’d
Link Tags
<A> </A> Create Link to another
document
HREF = URL URL of document to be linked
text Text to be clicked, usually in blue
Example Tag with Absolute URL:
<A
HREF=“http://www.ohiou.edu/mainmenu.html”>Menu</A>
Example Tag with Relative URL:
<A HREF="mainmenu.html">Menu</A>
26
27. Cont’d
Link Tags to an Anchor Spot
To create a link to a specific spot in a 2nd document, there must
be an anchor name in the 2nd document. Then you create a link
in the 1st document that points to the anchor in the 2nd
document.
<A> </A> Create link to a document
id= name Name of the anchor spot
Example Creating an Anchor Name:
<A id=“Start_Place”>Table of Contents</A>
Example Referencing an Anchor:
<A HREF="#Starting_Place”>Go To the Contents</A> in the
same page
<A HREF=“page path#Starting_Place”>Go To the
27
28. Cont’d
Link to a document on the
same server in the same directory:
same server in the parent directory:
same server in the subdirectory stuff:
Link to an external Web site:
Always use a full URL, including "http://"
Using target="_blank" attribute opens link in new
window
Link to an e-mail address:
28
<a href="form.html">Fill Our Form</a>
<a href="../parent.html">Parent</a>
<a href="stuff/cat.html">Catalog</a>
<a href="http://www.devbg.org" target="_blank">BASD</a>
<a href="mailto:bugs@example.com?subject=Bug+Report">
Please report bugs here (by e-mail only)</a>
29. Cont’d
Link to a document called apply-now.html
On the same server, in same directory
Using an image as a link button:
Link to another location in the same document:
Link to a specific location in another document:
29
<a href="apply-now.html"><img src="apply-now-button.jpg" /></a>
<a href="#section1">Go to Introduction</a>
...
<h2 id="section1">Introduction</h2>
<a href="chapter3.html#section3.1.1">Go to Section 3.1.1</a>
30. Cont’d
HTML Images
HTML images are defined with the <img> tag.
<img src=“imagefilename.extenssion” alt=“something
to be displayed in the absence of the image” width=“”
height=“”>
Image attributes:
Example: 30
<img src="/img/basd-logo.png">
src Location of image file (relative or absolute)
alt Substitute text for display (e.g. in text mode)
height Number of pixels of the height
width Number of pixels of the width
border Size of border, 0 for no border
<img src="./php.png" alt="PHP Logo" />
31. HTML Elements
HTML element is everything from the start tag to end
tag:
Start tag is often called the opening tag <element>
End tag is often called the closing tag </element>
Element content is everything between start and end
tag
Some HTML elements have empty content (element
without a content)
<br> defines a new line (line break)
Empty elements are closed in the start tag
Most HTML elements can have attributes
Eg. <p>this is aparagraph</p>
<a href=“”> this is alink</a>
Most HTML elements can be nested (can contain other
HTML elements). 31
32. HTML Attributes
Attributes provide additional information about
HTML elements.
HTML elements can have attributes
Attributes come in name/value pairs like:
name="value“
E.g <a href=“compg2.html”> link text</a>
the link address is specified in the href attribute
Always cote attribute values
E.g href=“compg2.html”
Attribute names and attribute values are case-
insensitive.
32
33. Testing Your Web Page
Test the page under various browsers.
Test the page under various platforms and with
various screen resolutions.
Also remember to test all the links on the page.
33
34. First HTML Page
<html>
<head>
<title>My First HTML Page</title>
</head>
<body>
<h1>Exercise One</h1>
<p>This is some text will
appear on web page.</p>
</body>
</html>
firstpage.html
34
35. Color Codes
Colors are set using “RGB” color codes, which are,
represented as hexadecimal values.
Each 2-digit section of the code represents the amount, in
sequence, of red, green or blue that forms the color.
35
37. Cont’d
In Body element
To set document’s background color, edit <BODY>
element by adding BGCOLOR attribute
<BODY BGCOLOR=“#FFFFFF”></BODY>
for white background color
TEXT attribute is used to control the color of all the
normal text in the document.
Default color for text is black
The TEXT attribute would be added as follows:
<BODY BGCOLOR=“#FFFFFF” TEXT=“#FF0000”></BODY>
The document’s page color is white and text would be
red.
37
38. Cont’d
Attributes control the colors of the different link states:
1. LINK – initial appearance – default = Blue.
2. VLINK – visited link – default = Purple.
3. ALINK –active link being clicked–default= red.
The Format for setting these attributes is:
<BODY BGCOLOR=“#FFFFFF” TEXT=“#FF0000”
LINK=“#0000FF” VLINK=“#FF00FF” ALINK=“FFFF00”>
</BODY>
An image can be as document’s background
<BODY BACKGROUND=“hi.gif”
BGCOLOR=“#FFFFFF”></BODY>
Color for specific text
<Font color=white>
38
39. HTML Comments
Comment
a piece of code which is ignored by any web browser.
a good practice to add comments into your HTML code,
especially in complex documents, to indicate sections of
a document, and any other notes to anyone looking at
code
help you and others understand your code and increases
code readability
HTML comments are placed in between <!-- ... --> tag.
Eg.,
<head> <!-- Document Header Starts -->
<title>This is document title</title>
< !-- This is not a valid comment --> b/c there is a
space between the left angle bracket and the
39
40. HTML Forms
Forms are required when you want to collect some
data from the site visitor
Eg., during user registration you would like to collect
information such as name, email address, credit card,
etc.
Main application: to provide user input for
programs and databases located on a web server
local (client-side) scripts associated with the form
Server-based programs may return data to the client as
a web page
Client-side scripts can read input data
To validate the data, prior to sending to server
To use in local processing which may output web page
40
41. Cont’d
41
Attribute Description
action Backend script ready to process your passed data.
method Method to be used to upload data. The most frequently
used are GET and POST methods.
target Specify the target window or frame where the result of the
script will be displayed. It takes values like _blank, _self,
_parent etc.
enctype You can use the enctype attribute to specify how the
browser encodes the data before it sends it to the server.
Possible values are:
application/x-www-form-urlencoded - This is the
standard method most forms use in simple scenarios.
mutlipart/form-data - This is used when you want to
upload binary data in the form of files like image, word
file etc.
42. HTML Form Controls
There are different types of form controls that
you can use to collect data using HTML form:
Text Input Controls
Checkboxes Controls
Radio Box Controls
Select Box Controls
File Select boxes
Hidden Controls
Clickable Buttons
Submit and Reset Button
42
43. Cont’d
i. Text Input Controls
There are three types of text input used on forms:
Single-line text input controls - used for items that
require only one line of user input, such as search
boxes or names.
created using HTML <input> tag.
Password input controls - is also a single-line text
input but it masks character as soon as a user enters
it.
created using HTML <input> tag.
Multi-line text input controls - used when the user is
required to give details that may be longer than a
single sentence.
created using HTML <textarea> tag.
43
44. Cont’d
i. Text Input Controls
There are three types of text input used on forms:
Single-line text input controls
Example
<form >
First name: <input type="text“ name="first_name" />
<br>
Last name: <input type="text" name="last_name" />
</form>
44
45. Cont’d
i. Text Input Controls
There are three types of text input used on forms:
Single-line text input controls
Attributes – for <input> tag for creating text field.
CoSc 3101 – Internet Programming AMU - CSIT
45
Attribute Description
type Indicates the type of input control and for text input
control it will be set to text.
name Used to give a name to the control which is sent to the
server to be recognized and get the value.
value Used to provide an initial value inside the control.
size Allows to specify the width of the text-input control in
terms of characters.
maxlength Allows to specify the maximum number of characters a
user can enter into the text box.
46. Cont’d
i. Text Input Controls
There are three types of text input used on forms:
Password input controls
Example
<form >
User ID : <input type="text" name="user_id" /><br>
Password: <input type="password" name="password"
/>
</form>
46
47. Cont’d
i. Text Input Controls
There are three types of text input used on forms:
Password input controls
Attributes – for <input> tag for creating password field.
CoSc 3101 – Internet Programming AMU - CSIT
47
Attribute Description
type Indicates the type of input control and for password
input control it will be set to password.
name Used to give a name to the control which is sent to the
server to be recognized and get the value.
value Used to provide an initial value inside the control.
size Allows to specify the width of the text-input control in
terms of characters.
maxlength Allows to specify the maximum number of characters a
user can enter into the text box.
48. Cont’d
i. Text Input Controls
There are three types of text input used on forms:
Multi-line text input controls
<form>
Description : <br /><textarea rows="5" cols="50"
name="description">
Enter description here...
</textarea>
</form>
48
49. Cont’d
i. Text Input Controls
There are three types of text input used on forms:
Multi-line text input controls
Attributes – for <textarea> tag
49
Attribute Description
name Used to give a name to the control which
is sent to the server to be recognized and
get the value.
rows Indicates the number of rows of text area
box
cols Indicates the number of columns of text
area box
50. Cont’d
i. Text Input Controls
File
<type = “file”>
provides a file dialogue box to specify a file that
is sent to the server
Hidden
<type = “hidden”>
similar to text input, but the value attribute is
used to specify data that is to be sent to the
server. Nothing appears on the screen.
The data might be set by a server program to
keep track of the details of a particular
transaction.
50
51. Cont’d
ii. Checkbox Control
Checkboxes are used when more than one option is
required to be selected.
created using HTML <input> tag but type attribute is set to
checkbox.
Example
<form>
<input type="checkbox" name="maths“ value="on">
Maths
<input type="checkbox" name="physics" value="on">
Physics
</form>
51
52. Cont’d
ii. Checkbox Control
Attributes for checkbox
52
Attribute Description
type Indicates the type of input control and for
checkbox input control it will be set to
checkbox.
name Used to give a name to the control which is
sent to the server to be recognized and get
the value.
value The value that will be used if the checkbox is
selected.
checked Set to checked if you want to select it by
53. Cont’d
iii. Radio Button Control
Radio buttons are used when out of many options, just
one option is required to be selected.
created using HTML <input> tag but type attribute is set to
radio.
Example
<form>
<input type=“radio" name=“subject“ value=“maths">
Maths
<input type=“radio" name=“subject" value=“physics">
Physics
</form>
53
54. Cont’d
iii. Radio Button Control
Attributes for radio button
54
Attribute Description
type Indicates the type of input control and for
checkbox input control it will be set to radio.
name Used to give a name to the control which is
sent to the server to be recognized and get
the value.
value The value that will be used if the checkbox is
selected.
checked Set to checked if you want to select it by
default.
55. Cont’d
iv. Select Box Control – also called drop down box
provides option to list down various options in the
form of drop down list, from where a user can select
one or more options.
Example
<form>
<select name="dropdown">
<option value="Maths" selected>Maths</option>
<option value="Physics">Physics</option>
</select>
</form>
55
56. Cont’d
Attributes of <select> tag
Attributes of <option> tag
CoSc 3101 – Internet Programming AMU - CSIT
56
Attribute Description
name Used to give a name to the control which is sent to
the server to be recognized and get the value.
size This can be used to present a scrolling list box.
multiple If set to "multiple" then allows a user to select
multiple items from the menu.
Attribute Description
value The value that will be used if an option in the select
box is selected.
selected Specifies that this option should be the initially
selected value when the page loads.
label An alternative way of labeling options
57. Cont’d
v. The Submit & Reset Button
Defines a button for submitting a form to a form-
handler
<input type="submit">
<input type=“reset"> – clears all data entered so far
form-handler – server page with script for processing input
data
The form-handler is specified in the form's action attribute:
To be submitted correctly, each input field must have name
attribute.
<form action="action_page.php">
First name:<br>
<input type="text" name="firstname"
value="Mickey"><br>
57
58. Cont’d
v. The Submit Button
Action attribute – defines the action to be performed
when the form is submitted
The common way to submit a form to a server, is by using a
submit button.
In the example above, server-side script (PHP program) is
specified to handle the submitted form (process the form
data):
<form action="action_page.php">
If action attribute is omitted, the action is set to current
58
59. Cont’d
v. The Submit Button
Method attribute – specifies the way that form data is
sent to the server program
specifies the HTTP method (GET or POST) to be used
when submitting the forms:
GET appends the data to the URL
POST sends the data separately
<form action="action_page.php" method="get">
or
<form action="action_page.php" method="post">
59
60. Cont’d
v. The Submit Button
When to use GET? – default method
If the form submission is passive (like a search engine
query), and without sensitive information.
best suited to short amounts of data. Size limitations are
are set in your browser.
form data will be visible in the page address:
action_page.php?firstname=Mickey&lastname=M
ouse
When to use POST?
If the form is updating data, or includes sensitive
information (password).
offers better security because the submitted data is not
visible in the page address. 60
61. Cont’d
v. The Submit Button
GET vs POST
61
1.Post method is more secure.
2.Post method sent data to
http response (body).
3.Post method sent more
data.
4.Post method is not good for
search but it is good for
hidden data.
1.Get method is less secure.
2.Get method sent data to
page address.
3.Get method sent less data.
4.Get method is good for
search content in order to
let users to used it again.
62. Cont’d
vi. Button
The name attribute uniquely identifies a button
The value attribute gives a label to the button
Actions can be associated with buttons- more later
62
Do you want to receive any further
information:<br>
<input type="button" name="yes" value=" Yes ">
63. Cont’d
Form Attributes
63
Attribute Description
accept-
charset
Specifies charset used in submitted form (default: the page
charset).
action
Specifies an address (url) where to submit the form (default:
the submitting page).
autocomplet
e
Specifies if the browser should autocomplete the form
(default: on).
enctype
Specifies encoding of the submitted data (default: is url-
encoded).
method
Specifies HTTP method used when submitting form (default:
GET).
name Specifies a name used to identify the form
novalidate Specifies that the browser should not validate the form.
64. Cont’d
Exercise
Create an HTML page which displays student
registration screen with
– a name field
– an ID field
– a department field {select box with values:
1. Computer Science
2. Information Technology
– a semester field {select box with values:
1. I
2. II
– an academic year field {select box with values: 1998-2000, 2000
default}
– a button to submit the form
– a button to reset the form
65. HTML Table
HTML table – an element comprised of table
rows and columns: these specify cells of the
table
Cells can contain text, images, links, other
tables...
Purpose: to house other HTML elements and
arrange them in a tabular fashion -- row by row,
column by column.
Table element consists of three different HTML
tags including
<table> tag,
<tr> (table rows), and
65
66. Cont’d
Table attributes
align alignment relative to the page
width in pixels or percentage of page width
border - width of border (pixels)
cellspacing – separation between cells (pixels)
cellpadding - space around data inside cell (pixels)
bgcolor - background colour (inside cells)
66
Furthermore
• The <caption> element puts a title above the
table
67. Cont’d
Table rows and table columns
Table can contain an infinite number of table
rows
Each table row is essentially a table element
itself, with an opening and closing tag (<tr>
</tr>)
Table columns are also considered child
elements of HTML tables, and like table rows, an
HTML table may contain an infinite number of
table data cells (<td> <tr>)
67
68. Cont’d
Table row attributes
align=“alignment” {left, center, right}
bgcolor=“color”
height=“height”
Table data/heading attributes
align=“alignment”
width=“width”
bgcolor=“color”
Unless otherwise specified, <tr> and <td> inherit
attributes of <table> whenever it applies.
68
69. Cont’d
<table border = “1”>
<tr title = “You are looking at Row 1”
bgcolor=“silver”>
<td> Row 1 Cell 1</td>
<td> Row 1 Cell 2 </td>
</tr>
<tr title = “You are looking at Row 2”
bgcolor=“aqua”>
<td> Row 2 Cell 1</td>
<td> Row 2 Cell 2 </td>
</tr>
</table> 69
73. Cont’d
Tables: align and width attributes
Align – determines position
of text within a cell
Width – determines width
of row relative to table
73
<table border="1" align="center">
<tr>
<th colspan="2"
width="60%">Name</th>
<th rowspan="2">Course</th>
<th rowspan="2">Year</th>
</tr>
<tr>
<th>First</th>
<th>Last</th>
</tr>
<tr>
<td>Helen</td>
<td>Getahun</td>
<td>IP</td>
<td align="center">2</td>
</tr>
<!– etc -->
74. HTML Embedded Multimedia
Sometimes you need to add music or video into your
web page using HTML tag called <embed>
This tag causes the browser itself to include controls
for the multimedia automatically provided browser
supports <embed> tag and given media type.
You can also include a <noembed> tag for the
browsers which don't recognize the <embed> tag
Example – to play an embedded midi file:
<embed src="/html/yourfile.mid" width="100%"
height="60" >
<noembed><img src="yourimage.gif" alt="Alternative
Media" ></noembed>
</embed> 74
75. Cont’d
The <embedded> Tag Attributes for radio button
CoSc 3101 – Internet Programming AMU - CSIT
75
Attribute Description
Align Determines how to align the object. It can be set
to either center, left or right.
autostart This boolean attribute indicates if the media
should start automatically. You can set it either
true or false.
loop Specifies if the sound should be played
continuously (set loop to true), a certain number
of times (a positive value) or not at all (false)
playcount Specifies the number of times to play the sound.
This is alternate option for loop if you are using
IE.
hidden Specifies if the multimedia object should be
76. Cont’d
The <embedded> Tag Attributes for radio button
76
Attribute Description
width Width of the object in pixels
height Height of the object in pixels
name A name used to reference the object.
src URL of the object to be embedded.
volume Controls volume of the sound. Can be from 0
(off) to 100 (full volume).
77. Cont’d
Supported Video Types
various media types like Flash movies (.swf), AVI's
(.avi), and MOV's (.mov) file types inside embed tag.
.swf files - created by Macromedia's Flash program.
.wmv files - are Microsoft's Window's Media Video file
types.
.mov files - are Apple's Quick Time Movie format.
.mpeg files - created by the Moving Pictures Expert
Group.
<body>
<embed src="/html/yourfile.swf" width="200" height="200"
>
<noembed><img src="yourimage.gif" alt="Alternative
Media" ></noembed>
77
78. Cont’d
Background Audio
use HTML <bgsound> tag to play a soundtrack in
the background of your webpage
this tag is supported by Internet Explorer only and most
of the other browsers ignore
background sound file also will replay whenever the user
refreshes the browser.
having only two attributes loop and src.
<body>
<bgsound src="/html/yourfile.mid">
<noembed><img src="yourimage.gif"
></noembed>
</bgsound>
78
produce blank screen
does not display any component and remains
hidden
79. Cont’d
Attributes
HTML <bgsound> tag also supports following
attributes:
Browser Support
79
Attribute Value Description
loop number Lets you replay a background
soundtrack a certain number of times.
src URL Specifies the path of the sound file.
Chrome Firefox IE Opera Safari Android
No No Yes No No No
80. Cont’d
HTML Audio – Browser Support
Currently, there are 3 supported file formats for the
<audio> element: MP3, Wav, and Ogg:
80
Browser Mp3 Wav Ogg
Internet Explorer YES No No
Chrome YES YES YES
Firefox YES YES YES
Safari YES YES No
Opera YES YES YES
81. Frames & Framesets
Frames are a way of dividing the browser window
into several independent windows where each
section can load a separate HTML document
Each frame can be independently loaded a
different url.
Frameset - collection of frames in the browser
window
The window is divided into frames in a similar way
the tables are organized: into rows and columns.
Has advantages and drawbacks
Advantages
Improved performance (minimal page refresh)
Flexibility 81
82. Cont’d
Drawbacks
Fairly complex (for developer)
May confuse users (if not properly used)
Some (old) browsers may not support frames
URL masking, when printing and bookmarking
Frames are found in Framesets
Framesets define the ‘layout’ of the frames it
contains
Framesets can be nested in one another to provide
a more complex layout.
82
88. Cont’d
Example 2 test.html
<html>
<head><title>HTML Target Frames</title></head>
<frameset cols="200, *">
<frame src="menu.html" name="menu_page" />
<frame src="main.html" name="main_page" />
<noframes>
<body>
Your browser does not support frames.
</body>
</noframes>
</frameset>
</html>
88
89. Cont’d
Example 2 main.html
<html>
<body bgcolor="#b5dcb3">
<h3>This is main page and content from any link will be displayed
here.</h3>
<p>So now click any link and see the result.</p>
</body>
</html>
menu.html
<html>
<body bgcolor="#4a7d49">
<a href="http://www.google.com" target="main_page">Google</a><br /><br />
<a href="https://mail.google.com/" target="main_page">G-Mail</a><br /><br />
<a href="http://news.bbc.co.uk" target="main_page">BBC News</a>
</body>
89
90. Cont’d
target attribute can also take one of the ff values
90
Option Description
_self Loads the page into the current frame.
_blank Loads a page into a new browser
window.
_parent Loads the page into the parent
window, which in the case of a single
frameset, is the main browser window.
_top Loads the page into the browser
window, replacing any current frames.
targetfram Loads the page into a named
91. Cont’d
Inline frames (iframe)
also called floating frames (webpage within
webpage)
Like frames
But can occur anywhere in the <body> tag of an
html document
Unlike frames which should only occur in the
<frameset> tag
<iframe> tag defines a rectangular region within
the document in which the browser can display a
separate document
Tag format:
91
92. Cont’d
Inline frames (iframe) – attributes
Attributes
src = “url”
name = “name”
height = “value”
width = “value”
scrolling = “value” { auto, yes, no }
noresize [= “noresize”]
align = “alignment” { left, right, middle, top,
bottom }
frameborder – whether or not the borders of that
frame are shown = {1(yes) or 0(no)}
92