HTML5 Introductory One

Source: Internet
Author: User
Tags html header

<!DOCTYPE HTML><HTML><Head><MetaCharSet= "Utf-8"><title>Beginner's Tutorial (runoob.com)</title></Head><Body>    <H1>My first page</H1><P>My first paragraph.</P><Script>Window.alert (5 + 6);</Script>    </Body></HTML>
    • DOCTYPE declares the document type
    • Located in Tags
    • Located in tags <body> and </body> for visualizing web content
    • Used in label
    • Located in label <p> with </p> as a paragraph display

Can be seen:

    • HTML is a language used to describe a Web page;
    • Markup language is a set of tag tags (markup tag)
    • HTML uses tag tags to describe Web pages
    • The browser is not a direct display of HTML tags, but can use tags to determine how to display the content of the HTML page to the user;

Base extension:

<a>: Define Links

HREF: Specifying a hyperlink address

Example: <a href = "http://www.gameres.com" > Idle net </a>

: Defining images

Example:

If you do not configure by the aspect ratio of the icon itself, the icon will be stretched/compressed by the configured aspect ratio

HTML Properties:

The above href is an attribute, the image source, the length and the width of the IMG tag are provided by the attribute, you can know:

    • Attributes are labeled at the beginning of the label;
    • Use double quotation marks for the value of the property;

ID attribute Example:

<HTML><Head><Scripttype= "Text/javascript">functionChange_header () {document.getElementById ("MyHeader"). InnerHTML="Nice day!";}</Script></Head><Body><H1ID= "MyHeader">Hello world!</H1><Buttononclick= "Change_header ()">Change text</Button></Body></HTML>

HTML horizontal lines and comments:

< HR >    <!--  -<hr><hr>

Wrapping HTML Paragraphs:

< P > This <br> paragraph <br> demonstrates the effect of the branch </  p>

HTML text formatting:

<b>Show Bold text</b> <BR>   <!--Invalid line break -<I>Show Italic text</I> <BR><Big>Show large text</Big> <BR><Small>Show small text</Small> <BR><Pre>                <!--line break Valid -line breaks can be done without labels</Pre><P>WWF ' s goal is to:<!--line break Valid -            <Q>Build a future where people live in harmony with nature.</Q>    <!--<q> Output Quotes -We hope they succeed.</P><P>My Favorite color is<del>Blue</del> <ins>Red</ins>!</P>        <!--Remove effects and underline effects -

Leave the tutorial source convenient query: http://www.runoob.com/html/html-formatting.html.

HTML Links:

Target property: Defines where the linked document is displayed.

<href= "http://www.gameres.com"  target= "_blank"> Floating net </a>

Use a picture as a link:

 <  p  >   picture link  <  a  href  = "http://www.gameres.com"  >  <  img  src  = "Testimg.png"   = "730"   height  = " >  </ a  ></ p  >  

Link to the current page at the specified location:

<!DOCTYPE HTML><HTML><Head><MetaCharSet= "Utf-8"><title>Beginner's Tutorial (runoob.com)</title></Head><Body><P><ahref= "#C2">View Chapter 2</a></P><H2>Chapter 1</H2><P>This shows the contents of this section ...</P><H2><aID= "C2">Chapter 2</a></H2><P>This shows the contents of this section ...</P><H2>Chapter 3</H2><P>This shows the contents of this section ...</P></Body></HTML>

HTML Header:

label Description
Defines the information for a document
<title> Defines the title of the document
<base> Defines the default link address for page link labels
<link> Defines a relationship between a document and an external resource
<meta> Defines the metadata in an HTML document
<script> Defines a script file for the client
<style> A style file that defines an HTML document

HTML5 Introductory One

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.