Home > Others

Dragon Boat Festival small holiday--front-End Basics 01

Source: Internet
Author: User
Developer on Alibaba Coud: Build your first app with APIs, SDKs, and tutorials on the Alibaba Cloud. Read more ＞

    • The relationship between HTML and CSS

1) HTML is a vector of text and pictures above the Web page.

2) CSS is style, text font, color, border

3) JavaScript is a special effect, pop-up fade in

    • HTML tags

1)

2) The contents of each part of the webpage must be placed in the label to display

3) Labels are case-insensitive and are generally lowercase

    • Structure of the HTML file

<HTML> Root Tags

< Head>

< head>

< title>......</title> displayed in the browser's title bar

< script>......</script>

< style>.......</style>

< link>

<meta>

The

<body> ....</body> inside is the main content of the webpage,

</HTML>

    • Code comments for HTML

<!--comment text--

The following study should pay attention to two aspects of learning: the use of tags, tags in the browser default style

    • <p> tags, paragraphs

Grammar:<p> paragraph text </p>, a text with a <p></p> tag, if there are three paragraphs of text, with three <p></p> tags

Purpose: To add a title to the page, a total of 6, H1,H2,H3,H4,H5,H6,H1 is the highest level

Syntax:

Style:<body>

</body>

    • < strong> in bold to indicate,<em> in italics

Grammar:<em> Text to emphasize </em> < strong> to emphasize text </strong>

    • <span> need to set a single style for something, add a tag to the head, set the style, use it in the body

span{
Color:blue;
}
< body>
< p> in pursuit of his <span> American dream </span> he moved into a bay near New York. </p>
</body>

    • <q>, short text quote, a word, a poem

Syntax:<q> reference </q> the quoted text does not need double quotes, and the browser automatically adds double quotes

    • <blockquote>, long text references, a large paragraph of words

Syntax:<blockquote> reference text </blockquote> the quoted text does not need double quotes, and the browser automatically adds double quotes

    • <br> Branch display text, function equivalent to carriage return line, is an empty label, only start tag, no end tag

Syntax: <br/>, add in where you need to enter a newline

    • &nbsp;

Grammar:&nbsp;

Syntax:

    • < Address>, email address, document author, address, displayed on the page is italic

Syntax:<address> contact address information </address>

    • <code> display programming code in a Web page, a piece of code

Syntax:<code> code language </code>

    • <pre> Add a large segment of code to a Web page

Syntax:<pre> code </pre>

    • < Ul><li> Add a list of news listings display, each with a dot before Li

Grammar:

<ul>

< li> information </li>

</ul>

    • <ol> Add book sales leaderboard, default starting from 1

Grammar:

<ol>

<li> Information </li>

</ol>

    • <div> split the code of Independent logic

Grammar:<div>......</div>

    • Name Div

Syntax: <div id = "Version name" >....</div>

    • Table label, four elements: Table,tbody,tr line, TH table header, TD column
    • Caption, add a title to the table, display in the page, summary, add a summary for the table, do not show it;

Syntax: <table summary= "Table Introduction Text" >

eg

<table summary= "This table records 2012 to 2013 inventory records, including USB flash drive and headset inventory" >
< caption>2012 year to 2013 inventory records </caption>

</table>

    • <a> hyperlinks

Grammar:

<a href= "Destination url" title= "mouse over displayed text" > link displayed text </a>

eg

<a href= "www.baidu.com" title = "Baidu" > Baidu </a>

Note: The default is open in the current browser window, if you need to open in a new window,

<a href= "Destination url" target= "_blank" >click here!</a>

<a href= "Destination url" title= "mouse over displayed text" target= "_blank" > link displayed text </a>

    • mailto link the email address in the Web page, the next time there are multiple parameters, the first parameter to? At the beginning, each of the following parameters is separated by &

Grammar:

<a href = "mailto:[email protected]?" subject= topic &body= message content > Send </a>

    • IMG, inserting pictures for web pages

Grammar:

SRC is the location of the identity image, alt specifies the image of the descriptive file, when the image is not visible when the text is displayed, title mouse over the text displayed in the picture, image support GIF, PNG, JPEG

    1. Recognize the label to an adjourned.

Dragon Boat Festival small holiday--front-End Basics 01

This article is an English version of an article which is originally in the Chinese language on aliyun.com and is provided for information purposes only. This website makes no representation or warranty of any kind, either expressed or implied, as to the accuracy, completeness ownership or reliability of the article or any translations thereof. If you have any concerns or complaints relating to the article, please send an email, providing a detailed description of the concern or complaint, to info-contact@alibabacloud.com. A staff member will contact you within 5 working days. Once verified, infringing content will be removed immediately.

Related Keywords:
cartoon boat boat vector dragon esbs 01 basics gmt 01 ttc8 01

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.

What's Trending
Top 10 Tags
datastax versions naming convention zookeeper client class definition md5 microsoft sql server 2005 data structures exception handling error handling
Top 10 Keywords
microsoft download center down wordpress address url site address url wordpress address url windows installer 4 0 download 302 not found web address url definition site address url wordpress db2 integer mac os installation step by step pdf abbreviation for return

A Free Trial That Lets You Build Big!

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

Get Started for Free

  • Sales Support

    1 on 1 presale consultation

    Chat Contact Sales

  • After-Sales Support

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

    Open a Ticket

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

    Learn More