HTML Fundamentals
HTML FORMS- an HTML form can contain what type of input elements?
text fields, checkboxes, radio-buttons, submit buttons and more. A form can also contain select lists, textarea, fieldset, legend, and label elements.
The HTML <base> Element The <base> tag specifies? Example
the base URL/target for all relative URLs in a page: <head> <base href="http://www.w3schools.com/images/" target="_blank"> </head>
The text between <body> and </body> is
the visible page content
The text between <html> and </html> describes
web page
What is an HTML ELEMENT?
"HTML tags" and "HTML elements" are often used to describe the same thing. But strictly speaking, an HTML element is everything between the start tag and the end tag, including the tags: HTML Element: <p>This is a paragraph.</p>
HTML Tables - How is a Table Divided? What is the tag for each section?
* <tr>ROW - Table is divided into rows (with the <tr> tag), * <td> TABLE DATA - 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.
HTML ELEMENTS SYNTAX "Structure"?
* An HTML element starts with a start tag / opening tag * An HTML element ends with an end tag / closing tag * The element content is everything between the start and the end tag * Some HTML elements have empty content * Empty elements are closed in the start tag Most HTML elements can have attributes
Write how would write a link tag that defines stylesheet type is text/css file name: mystyle?
...
STEPS to Writing HTML in Note Page
1. Open Notepad 2. Create Html 3. Save File with extension .html end of file name - All files - UTF 8
What HTML Tag is used to create abbreviations? How would you write tag the Word Health Organization whos abbrevation is who? How would you write abbrebiation tage for As Soon as Possible to be ASAP?
<!DOCTYPE html> <html> <body> <p>The <abbr title="World Health Organization">WHO</abbr> was founded in 1948.</p> <p>Can I get this <abbr title="as soon as possible">ASAP</abbr>?</p> <p>The title attribute is used to show the spelled-out version when holding the mouse pointer over the acronym or abbreviation.</p> </body> </html>
How to make a link that is not underlined, with the style attribute.
<!DOCTYPE html> <html> <body> <a href="http://www.w3schools.com" style="text-decoration:none;">Visit W3Schools.com!</a> </body> </html>
How to define contact information for the author/owner of an HTML document? What tag? Write Example Email and Address
<!DOCTYPE html> <html> <body> <address> Written by W3Schools.com<br> <a href="mailto:[email protected]">Email us</a><br> Address: Box 564, Disneyland<br> Phone: +12 34 56 78 </address> </body> </html>
EXAMPLE How to write - Create email Link: Paragraph: this is email link Email is: [email protected] Subject: hello Text link is: send mail
<!DOCTYPE html> <html> <body> <p> This is an email link: <a href="mailto:[email protected]?Subject=Hello%20again" target="_top"> Send Mail</a> </p> <p> <b>Note:</b> Spaces between words should be replaced by %20 to ensure that the browser will display the text properly. </p> </body> </html>
Write Email link: email is: [email protected] CC [email protected] bcc: [email protected] Subject: Summer Party Body: You are invited to a big Summer party! text: Send Mail
<!DOCTYPE html> <html> <body> <p> This is another mailto link: <a href="mailto:[email protected][email protected]&[email protected]&subject=Summer%20Party&body=You%20are%20invited%20to%20a%20big%20summer%20party!" target="_top">Send mail!</a> </p> <p> <b>Note:</b> Spaces between words should be replaced by %20 to ensure that the browser will display the text properly. </p> </body> </html>
How to Write or tag text to be Highlighted?
<!DOCTYPE html> <html> <body> <p>Do not forget to buy <mark>milk</mark> today.</p> </body> </html>
Write - Meta Tag: for DESCRIPTION description: Free Web tutorials
<!DOCTYPE html> <html> <head> <meta name="description" content="Free Web tutorials"> </head> <body> <p>All meta information goes in the head section...</p> </body> </html>
Example of Base tag would be>
<!DOCTYPE html> <html> <head> <base href="http://www.w3schools.com/images/" target="_blank"> </head> <body> <img src="stickman.gif" width="24" height="39"> - Notice that we have only specified a relative address for the image. Since we have specified a base URL in the head section, the browser will look for the image at "http://www.w3schools.com/images/stickman.gif" <br><br> <a href="http://www.w3schools.com">W3Schools</a> - Notice that the link opens in a new window, even if it has no target="_blank" attribute. This is because the target attribute of the base element is set to "_blank". </body> </html>
How would you write meta tag for Charset Charset: UTF-8
<!DOCTYPE html> <html> <head> <meta name="author" content="Hege Refsnes"> <meta charset="UTF-8"> </head> <body> <p>All meta information goes in the head section...</p> </body> </html>
How would you write meta tag for author? Author Hege refsnes
<!DOCTYPE html> <html> <head> <meta name="author" content="Hege Refsnes"> </head> <body> <p>All meta information goes in the head section...</p> </body> </html>
How would you write Meta Tag for Keywords Keywords: HTML, CSS, XML, Javascript?
<!DOCTYPE html> <html> <head> <meta name="keywords" content="HTML,CSS,XML,JavaScript"> </head> <body> <p>All meta information goes in the head section...</p> </body> </html>
How to Write Style Html within the Head element for Headings H1: red H2: blue p: green
<!DOCTYPE html> <html> <head> <style type="text/css"> h1 {color:red;} h2 {color:blue;} p {color:green;} </style> </head> <body> <h1>All header 1 elements will be red</h1> <h2>All header 2 elements will be blue</h2> <p>All text in paragraphs will be green.</p> </body> </html>
Example of Add link to another page within the document - Image using attribute "a href" and "a id" <a href="#"> </a> <a id=" "> </a>
<a href="#C4">See also Chapter 4.</a> <h2><a id="C4">Chapter 4</a></h2>
Write example - if you want a link to open in a new browser? URL = www.w3schools Text link Visit W3Schools
<a href="http://www.w3schools.com/" target="_blank">Visit W3Schools!</a>
What is the proper Syntax to write a HTML hyper link? Example?
<a href="url">Link text</a>
TAG REFERENCE - DEFINES HTML Citations, Quotations, and Definition Tags Tag Description * Defines an abbreviation or acronym * Defines contact information for the author/owner of a document * Defines the text direction * Defines a section that is quoted from another source * Defines an inline (short) quotation * Defines the title of a work <dfn> Defines a definition term
<abbr> <address> <bdo> <blockquote> <q> <cite> <dfn>
HTML - Example- Submit button * Create form that would ask user to enter text defined as UserName with a submit button and which The Action is sent to "html_form_action.asp
<form name="input" action="html_form_action.asp" method="get"> Username: <input type="text" name="user"> <input type="submit" value="Submit"> </form>
HTML FORM - Example - Create Checklist Write code for = If you wanted to create a a form where person must check off what vehical they have: * I have a car * I have a bike
<form> <input type="checkbox" name="vehicle" value="Bike">I have a bike<br> <input type="checkbox" name="vehicle" value="Car">I have a car </form>
HTML FORM - Example - Create Radio Button Fields Write code for = If you wanted to create a a form where two radio buttons would ask user to identify or chose Sex * Male * Female
<form> <input type="radio" name="sex" value="male">Male<br> <input type="radio" name="sex" value="female">Female </form>
HTML FORM - Example - Create Write code for = If you wanted to create a form with with two text field * First name: * Last name:
<form> First name: <input type="text" name="firstname"><br> Last name: <input type="text" name="lastname"> </form>
HTML FORM - Example - Create Password Field Write code for = If you wanted to create a a form with
<form> Password: <input type="password" name="pwd"> </form> Note: The characters in a password field are masked (shown as asterisks or circles).
How would you insert Quotation marks around text - q element? example? Tag?
<h2>The q Element</h2> <p>The q element defines a short quotation.</p> <p>WWF's goal is to: <q>Build a future where people live in harmony with nature.</q> We hope they succeed.</p> <p><b>Note:</b> Browsers insert quotation marks around the q element.</p> </body> </html>
EXAMPLE of Internal Style sheet tag
<head> <style type="text/css"> body {background-color:yellow;} p {color:blue;} </style> </head>
How would you write tag to define a style text/ css for Body Background: yellow text of paragraph: blue
<head> <style type="text/css"> body {background-color:yellow;} p {color:blue;} </style> </head>
What is the Common Visualization Structure of aan HTML PAGE STRUCTURE
<html> <body> <h1>This a heading</h1> <p>This is a paragraph.</p> <p>This is another paragraph.</p> </body> </html>
FORM FIELD - What is the structure for most of the input type fields?
<input type=" " name="(Name of information collecting)" value="(visible text to user in form)"
Link to an external style sheet How to use the <link> tag to link to an external style sheet For Text CSS File name: styles.css
<link rel="stylesheet" type="text/css" href="styles.css"> </head>
How would you write HTML Link? So that Link: default.asp Link text will be: HTML Tutorial Text next to link: This is a link to a page?
<p> <a href="default.asp">HTML Tutorial</a> This is a link to a page on this website. </p>
How would you write HTML Link? So that Link: default.asp Link text will be: HTML Tutorial Text next to link: This is a link to a page?
<p> <a href="http://www.w3.org/">W3C</a> This is a link to a website on the World Wide Web. </p>
How Would you define a "Block Quote element ? What is tag? example
<p>Here is a quote from WWF's website:</p> <blockquote cite="http://www.worldwildlife.org/who/index.html"> For 50 years, WWF has been protecting the future of nature. The world's leading conservation organization, WWF works in 100 countries and is supported by 1.2 million members in the United States and close to 5 million globally. </blockquote>
Write and Give Example of * inserted text * deleted text (strikethough)
<p>My favorite color is <del>blue</del> <ins>red</ins>!</p>
EXAMPLE - HTML Tables with Headers
<table border="1"> <tr> <th>Header 1</th> <th>Header 2</th> </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>
Describe what is a hyperlink?
A hyperlink (or link) is a word, group of words, or image that you can click on to jump to another document. When you move the cursor over a link in a Web page, the arrow will turn into a little hand.
HTML LINK - ID Attribute how to write anchor with an id inside an html
An anchor with an id inside an HTML document: <a id="tips">Useful Tips Section</a>
An internal style sheet can be used if. How are they defined in an HTML document?
An internal style sheet can be used if one single document has a unique style. I Internal styles are defined in the <head> section of an HTML page, by using the <style> tag,
HTML <div> Element - A common use of the <div> element is for?
Another common use of the <div> element, is for document layout. It replaces the "old way" of defining layout using tables. Using <table> elements for layout is not the correct use of <table> The purpose of the <table> element is to display tabular data.
Attribute value should be enclosed in?
Attribute values should always be enclosed in quotes. Double style quotes are the most common, but single style quotes are also allowed. <a href="http://www.w3schools.com">This is a link</a>
What are attributes?
Attributes provide additional information about HTML elements.
How are attributes specified within an HTML Element?
Attributes provide additional information about an element * Attributes are always specified in the start tag * Attributes come in name/value pairs like: name="value"
HTML Blocks - How are block elements normally displayed within a browser? Examples?
Block level elements normally start (and end) with a new line when displayed in a browser. Examples: <h1>, <p>, <ul>, <table
Do browsers automatically add empty lines before or after a paragraph?
Browsers automatically add an empty line before and after a paragraph.
By default, how will the links below appear in all browsers: An unvisited link? A visited link? An active link?
By default, links will appear as follows in all browsers: An unvisited link is underlined and blue A visited link is underlined and purple An active link is underlined and red
What is used to style HTML Elements
CSS (Cascading Style Sheets) is used to style HTML elements.
What are the ways CSS can be added to HTML? * * *
CSS can be added to HTML in the following ways: Inline - using the style attribute in HTML elements Internal - using the <style> element in the <head> section External - using an external CSS file
HTML FORMS - Checkboxes * In a HTML form the Checkboxes let user select how many options? * What Tag is used to identify Checkbox?
Checkboxes <input type="checkbox"> defines a checkbox. Checkboxes let a user select ZERO or MORE options of a limited number of choices.
How to write - Create a link to the "Useful Tips Section" inside the same document: Text: Visit the Useful tips sections
Create a link to the "Useful Tips Section" inside the same document: 1. Create the <a href attribute "include #sign before" <a href="#tips">Visit the Useful Tips Section</a> 2. Add a name attribute without the # sign to the section you want <a name="tips"> (l5 33:00)
Meta tag use for description of webpage
Define a description of your web page: <meta name="description" content="Free Web tutorials on HTML and CSS">
Write - What tag would you use to define the title of a document? Example?
Define a title for an HTML document Use the <title> tag to define a title for a document. <!DOCTYPE html> <html> <head> <title>My first HTML page</title> </head>
Meta keywords use to define: Example: Tag is
Define keywords for search engines: <meta name="keywords" content="HTML, CSS, XML, XHTML, JavaScript">
Meta tag use to define author of a page
Define the author of a page: <meta name="author" content="Hege Refsnes">
What are Empty HTML elements? Give Example?
Empty HTML Elements HTML elements with no content are called empty elements. <br> is an empty element without a closing tag (the <br> tag defines a line break).
External Style sheet is ideal when? Each page must do what in order to link to external style sheet?
External Style Sheet An external style sheet is ideal when the style is applied to many pages. With an external style sheet, you can change the look of an entire Web site by changing one file. Each page must link to the style sheet using the <link> tag. The <link> tag goes inside the <head> section: <head> <link rel="stylesheet" type="text/css" href="mystyle.css"> </head>
What is an absoulte URL
Extrenal complete website full address and folders http://
TAG REFERENCE - HTML Form Tags New : New tags in HTML5. <form> <input> <textarea> <label> <fieldset> <legend> <select> <optgroup> <option> <button> ---------NEW in HTML 5------- <datalist> <keygen> <output>
HTML Form Tags New : New tags in HTML5. Tag Description <form> Defines an HTML form for user input <input> Defines an input control <textarea> Defines a multiline input control (text area) <label> Defines a label for an <input> element <fieldset> Groups related elements in a form <legend> Defines a caption for a <fieldset> element <select> Defines a drop-down list <optgroup> Defines a group of related options in a drop-down list <option> Defines an option in a drop-down list <button> Defines a clickable button <datalist>New Specifies a list of pre-defined options for input controls <keygen>New Defines a key-pair generator field (for forms) <output>New Defines the result of a calculation
HTML FORMS- forms are used to?
HTML Forms HTML forms are used to pass data to a server.
HTML Forms - What is the most important form element is the
HTML Forms - The Input Element The most important form element is the <input> element.
TAG REFERENCE HTML Grouping Tag NAME THE TAG *Defines a section in a document (block-level) *Defines a section in a document (inline)
HTML Grouping Tags Tag Description <div> Defines a section in a document (block-level) <span> Defines a section in a document (inline)
TAG REFERENCE HTML Grouping Tags - Tag Description are: <div> <span>
HTML Grouping Tags Tag Description <div> Defines a section in a document (block-level) <span> Defines a section in a document (inline)
HTML Inline Elements Inline elements are normally displayed? Examples:
HTML Inline Elements Inline elements are normally displayed without starting a new line. Examples: <b>, <td>, <a>, <img>
TAG REFERENCE HTML LAYOUT TAG <div> <span>
HTML Layout Tags Tag Description <div> Defines a section in a document (block-level) <span> Defines a section in a document (inline)
HTML Layouts - Using <div> Elements The div element is a _____element used for ____ HTML elements. The following example uses five div elements to create a multiple column layout, creating the same result as in the previous example
HTML Layouts - Using <div> Elements The div element is a block level element used for grouping HTML elements. The following example uses five div elements to create a multiple column layout, creating the same result as in the previous example
HTML links are defined with the what tag? What attribute specifies link? Give Example
HTML Links HTML links are defined with the <a> tag. The link address is specified in the href attribute. <a href="http://www.w3schools.com">This is a link</a>
HTML Style Example - Background Color The background-color property defines the background color for an "element": *body *h2 *p
HTML Style Example - Background Color The background-color property defines the background color for an element: Example <!DOCTYPE html> <html> <body style="background-color:yellow;"> <h2 style="background-color:red;">This is a heading</h2> <p style="background-color:green;">This is a paragraph.</p> </body> The background-color property makes the "old" bgcolor attribute obsolete.
HTML Style Example - Font, Color and Size
HTML Style Example - Font, Color and Size The font-family, color, and font-size properties defines the font, color, and size of the text in an element: Example <!DOCTYPE html> <html> <body> <h1 style="font-family:verdana;">A heading</h1> <p style="font-family:arial;color:red;font-size:20px;">A paragraph.</p> </body> </html>
HTML Style Example - Text Alignment The text-align property specifies the ______of an Element
HTML Style Example - Text Alignment The text-align property specifies the horizontal alignment of text in an element: Example <!DOCTYPE html> <html> <body> <h1 style="text-align:center;">Center-aligned heading</h1> <p>This is a paragraph.</p> </body> </html>
TAG REFENCE HTML Style Tags <style> <link>
HTML Style Tags Tag Description <style> Defines style information for a document <link> Defines the relationship between a document and an external resource
HTML Table Headers Header information in a table are defined using what tag? All major browsers display the text in the <th> element How?
HTML Table Headers 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.
HTML TABLES AND BORDER ATTRIBUTE *What happens if you specify / if you do not specify?
HTML Tables and the Border Attribute If you do not specify a border attribute, the table will be displayed without borders. Sometimes this can be useful, but most of the time, we want the borders to show.
HTML MARKUP Tags are usually called? *what are they? *what is basic structure of a tag?
HTML Tags HTML markup tags are usually called HTML tags * HTML tags are keywords (tag names) surrounded by angle brackets like <html> * HTML tags normally come in pairs like <b> and </b> *The first tag in a pair is the START tag, the second tag is the END tag The END tag is written like the start tag, with a forward slash before the tag name Start and end tags are also called opening tags and closing tags
HTML Blocks - HTML elements can be grouped together are *< > * < >
HTML elements can be grouped together with <div> and <span>.
TAG REFERENCE HTML head Elements - Define <head> <title> <base> <link> <meta> <script> <style>
HTML head Elements Tag Description <head> Defines information about the document <title> Defines the title of a document <base> Defines a default address or a default target for all links on a page <link> Defines the relationship between a document and an external resource <meta> Defines metadata about an HTML document <script> Defines a client-side script <style> Defines style information for a document
HTML headings are defined with what tags?
HTML headings are defined with the <h1> to <h6> tags. <!DOCTYPE html> <html> <body> <h1>This is heading 1</h1> <h2>This is heading 2</h2> <h3>This is heading 3</h3> <h4>This is heading 4</h4> <h5>This is heading 5</h5> <h6>This is heading 6</h6> </body> </html>
What is HTML? Stands for?
HTML is a language for describing web pages. * HTML stands for Hyper Text Markup Language
Explain HTML Markup language?
HTML is a markup language * A markup language is a set of markup tags * The tags describe document content * HTML documents contain HTML tags and plain text * HTML documents are also called web pages
Are HTML tags case sensitive?
HTML tags are not case sensitive: <P> means the same as <p>. Many web sites use uppercase HTML tags. W3Schools use lowercase tags because the World Wide Web Consortium (W3C) recommends lowercase in HTML 4, and demands lowercase tags in XHTML.
HTML uses tags like <b> and <i> are used for? These HTML tags are called?
HTML uses tags like <b> and <i> for formatting output, like bold or italic text. These HTML tags are called formatting tags (look at the bottom of this page for a complete reference).
REDO IMAGES
IMAGES
Inline STYLES Can be used if? To use inline styles use?
Inline Styles An inline style can be used if a unique style is to be applied to one single occurrence of an element. To use inline styles, use the style attribute in the relevant tag. The style attribute can contain any CSS property. EXP: how to change the text color and the left margin of a paragraph: <p style="color:blue;margin-left:20px;">This is a paragraph.</p>
REDO LISTS
LISTS
Meta data are typically used to specify? Use by browsers: Search engine:
Meta elements are typically used to specify page description, keywords, author of the document, last modified, and other metadata. The metadata can be used by browsers (how to display content or reload page), search engines (keywords), or other web services.
Metadata is? What tag provide metadata about the HTML data? Will it show on browser?
Metadata is data (information) about data. The <meta> tag provides metadata about the HTML document. Metadata will not be displayed on the page, but will be machine parsable.
Most HTML elements are defined as _____ or ____
Most HTML elements are defined as block level elements or as inline elements.
HTML LAYOUTS Most websites have put their content in what kind of layout? Formatted like
Most websites have put their content in multiple columns (formatted like a magazine or newspaper).
HTML Layouts - CSS is used to define what when creating multiple columns using <div> or <table> HTML elements?
Multiple columns are created by using <div> or <table> elements. CSS are used to position elements, or to create backgrounds or colorful look for the pages.
HTML LAYOUTS - Which HTML are used to create multimple columns?
Multiple columns are created by using <div> or <table> elements. CSS are used to position elements, or to create backgrounds or colorful look for the pages.
HTML Layout - is using <table> to create Website layout a correct use of the <table> element>
NO - Using <table> to create a nice layout is NOT the correct use of the element. The purpose of the <table> element is to display tabular data!
When the target attribute is set to target="_blank" attribute. When clicked the link will open where?
Notice that the link opens in a new window, even if it has no target="_blank" attribute. This is because the target attribute of the base element is set to "_blank".
HTML FORMS - Password field * In a HTML form the Password field define? * What Tag is used to identify text field?
Password Field <input type="password"> defines a password field: <input type="password">
To Provide Meta data for an HTML Docutment you would use what tage? Elements you can specify are?
Provide metadata for an HTML document Use <meta> elements to specify a description, keywords, author, and character set of a document.
HTML FORMS - Radio Button * In a HTML form the Radio lets users select how many choices ? * What Tag is used to identify Radio Button ?
Radio Buttons <input type="radio"> defines a radio button. Radio buttons let a user select ONLY ONE of a limited number of choices:
Meta tag used to Refresh document every 30 seconds:
Refresh document every 30 seconds: <meta http-equiv="refresh" content="30">
HTML Headings are Important because?
Search engines use your headings to index the structure and content of your web pages. Since users may skim your pages by its headings, it is important to use headings to show the document structure. H1 headings should be used as main headings, followed by H2 headings, then the less important H3 headings, and so on.
HTML Form - Submit Button * What tag is used to define a submit button? * What is a submit button used for? * Where is the data sent?
Submit Button <input type="submit"> defines a submit button. A submit button is used to send form data to a server. The data is sent to the page specified in the form's action attribute. The file defined in the action attribute usually does something with the received input:
TAG Refernce * Defines information about the document * Defines the title of a document * Defines a default address or a default target for all links on a page * Defines the relationship between a document and an external resource * Defines metadata about an HTML document
TAG REFERENCE HTML head Elements - Define <head> <title> <base> <link> <meta> <script> <style>
Links are specified using what attribute? Give Example?
TML links are defined with the <a> tag. The link address is specified in the href attribute: EXAMPLE<a href="http://www.w3schools.com"> This is a link</a>
HTML Tables - Tables are defined by what tag?
Tables are defined with the <table> tag.
TAG REFERENCE - DEFINES HTML Citations, Quotations, and Definition Tags Tag Description <abbr> <address> <bdo> <blockquote> <q> <cite> <dfn>
Tag Description <abbr> Defines an abbreviation or acronym <address> Defines contact information for the author/owner of a document <bdo> Defines the text direction <blockquote> Defines a section that is quoted from another source <q> Defines an inline (short) quotation <cite> Defines the title of a work <dfn> Defines a definition term
TAG REFERENCE - Tag Description TABLES <table> <th> <tr> <td> <caption> <colgroup> <col> <thead> <tbody> <tfoot>
Tag Description <table> Defines a table <th> Defines a header cell in a table <tr> Defines a row in a table <td> Defines a cell in a table <caption> Defines a table caption <colgroup> Specifies a group of one or more columns in a table for formatting <col> Specifies column properties for each column within a <colgroup> element <thead> Groups the header content in a table <tbody> Groups the body content in a table <tfoot> Groups the footer content in a table
HTML FORMS - Text Fields In a HTML form The text field defines what? What tag is used to identify text field?
Text Fields <input type="text"> defines a one-line input field that a user can enter text into:
What is a line break? When can you use this tag?
The <br> element is an empty HTML element. It has no end tag. Use the <br> tag if you want a line break (a new line) without starting a new paragraph:
HTML <div> does it have a special meaning?
The <div> element has no special meaning. Except that, because it is a block level element, the browser will display a line break before and after it.
HTML Forms - What is the Form Tag used to create an HTML form?
The <form> tag is used to create an HTML form? <form> . input elements . </form>
How can you create a horizontal line in an HTML page? What can it be used for?
The <hr> tag creates a horizontal line in an HTML page. The hr element can be used to separate content: *represents a paragraph-level thematic break, eg. scene change in a story, or transition to another topic within a section of a reference book NOTE: (horizontal rule) has changed in html 5 to seperate themes in a given document
HTML Forms - Input Element * What is it used for? * Does the Input Element vary? explain
The <input> element is used to select user information. An <input> element can vary in many ways, depending on the type attribute. An <input> element can be of type text field, checkbox, password, radio button, submit button, and more.
Does HTML <span> have a special meaing?
The <span> element has no special meaning.
What tag is used to define a Hyperlink?
The HTML <a> tag defines a hyperlink.
The HTML <div> Element - define is a
The HTML <div> Element The HTML <div> element is a block level element that can be used as a container for grouping other HTML elements. When used together with CSS, the <div> element can be used to set style attributes to large blocks of content. Another common use of the <div> element, is for document layout. It replaces the "old way" of defining layout using tables. Using <table> elements for layout is not the correct use of <table>. The purpose of the <table> element is to display tabular data.
What is the Head Element of HTML Document?
The HTML <head> Element The <head> element is a container for all the head elements. Elements inside <head> can include scripts, instruct the browser where to find style sheets, provide meta information, and more. The following tags can be added to the head section: <title>, <style>, <meta>, <link>, <script>, <noscript>, and <base>
The HTML <link> Element The Link tag defines?
The HTML <link> Element The <link> tag defines the relationship between a document and an external resource. The <link> tag is most used to link to style sheets: <head> <link rel="stylesheet" type="text/css" href="mystyle.css"> </head>
What is a HTML Script Element? What tag is used?
The HTML <script> Element The <script> tag is used to define a client-side script, such as a JavaScript. The <script> element will be explained in a later chapter.
The HTML <span> Element The HTML <span> element is an what kind of element? used for?
The HTML <span> element is an inline element that can be used as a container for text.
What The HTML Element tag is used to define style information for an HTML document? What does it do?
The HTML <style> Element The <style> tag is used to define style information for an HTML document. Inside the <style> element you specify how HTML elements should render in a browser:
What does an HTML Title Element do? Where is it required?
The HTML <title> Element The <title> tag defines the title of the document. The <title> element is required in all HTML/XHTML documents. The <title> element: defines a title in the browser toolbar provides a title for the page when it is added to favorites displays a title for the page in search-engine results
HTML Layout - Useful Tips Tip: The biggest advantage of using CSS
The biggest advantage of using CSS is that, if you place the CSS code in an external style sheet, * your site becomes MUCH EASIER to maintain. * You can change the layout of all your pages by editing one file.
What tags can be added to the head section?
The following tags can be added to the head section: <title>, <style>, <meta>, <link>, <script>, <noscript>, and <base>
What attribute specifies desination of a link? Write example?
The href attribute specifies the destination of a link. <a href="http://www.w3schools.com/">Visit W3Schools</a> which will display like this: Visit W3Schools Clicking on this hyperlink will send the user to W3Schools' homepage. Tip: The "Link text" doesn't have to be text. It can be an image or any other HTML element.
HTML Links with an id attribute can be used to?
The id attribute can be used to create a bookmark inside an HTML document. Tip: Bookmarks are not displayed in any special way. They are invisible to the reader.
The most important attribute of the <a> element ?
The most important attribute of the <a> element is the href attribute, which indicates the link's destination.
What is the preferred way to add css to HTML ?
The preferred way to add CSS to HTML, is to put CSS syntax in separate CSS files.
What is the Purpose of a Web Browser? How are HTML tags displayed in a web browser?
The purpose of a web browser (such as Google Chrome, Internet Explorer, Firefox, Safari) is to read HTML documents and display them as web pages. The browser does not display the HTML tags, but uses the tags to determine how the content of the HTML page is to be presented/displayed to the user:
What is a target attribute? When is you used?
The target attribute specifies where to open the linked document. The example below will open the linked document in a new browser window or a new tab:
HTML Layout -Tip: Because advanced layouts take time to create, a quicker option is to
Tip: Because advanced layouts take time to create, a quicker option is to use a template. Search Google for free website templates (these are pre-built website layouts you can use and customize).
When would you use a <base> tage?
To Define - Default URL and target for all links Use the <base> tag to specify a default URL and a default target for all links on a page.
HTML TABLES and BORDER - To display a table with borders, What tag is used to specify the border attribute: * give example
To display a table with borders, specify the border attribute: <table border="1"> <tr> <td>Row 1, cell 1</td> <td>Row 1, cell 2</td> </tr> </table>
When HTML <dive is used together with CSS the <div> element can be used to?
When used together with CSS, the <div> element can be used to set style attributes to large blocks of content.
When used HTML <span> is used together with CSS, the <span> element can be used to set
When used together with CSS, the <span> element can be used to set style attributes to parts of the text.
HTML documents are also called
are also called web pages
How to Write - create a link to the "Useful Tips Section" from another page: URL: www.w3schools.com TEXT: visit the useful tips sections
create a link to the "Useful Tips Section" from another page: <a href="http://www.w3schools.com/html_links.htm#tips"> Visit the Useful Tips Section</a>
HTML images are defined with what tag? What attributes are included? Give Example
defined with the <img> tag. The filename and the size of the image are provided as attributes <img src="w3schools.jpg" alt="W3Schools.com" width="104" height="142">
The text between <p> and </p> is displayed as
displayed as a paragraph
The title element of html docutment is written in the head or body?
head
The text between <h1> and </h1>
is displayed as a heading
When learning HTML its recommend to use text editor lsuch as ____ or ____
or learning HTML we recommend a text editor like Notepad (PC) or TextEdit (Mac). We believe using a simple text editor is a good way to learn HTML.