Home > Developer > Web Develop
There are three main languages in the Web front-end:
HTML Page layout is responsible for putting the content you need to display, can be figuratively likened to the skeleton
CSS Web page debugging makes your HTML more beautiful, can be figuratively likened to the skin
JS Web page Dynamic effect can be added to the page dynamic effect, can be likened to muscle
Getting Started with HTML
HTML OverviewHTML is the initials of hypertext mark-up Language, meaning Hypertext Markup Language, hyper-text refers to hyperlinks, tags refers to the label is a language used to make Web pages, the language is composed of a label, Files made in this language are saved as a text file with a file extension of HTML or HTM.
The HTML basic structure is as follows:
Learning about Tags
Tags are also called elements, objects, nodes
Classification of labels
1. Can be divided into block-level elements and inline elements, depending on whether the element occupies one line alone
Block-level elements to occupy a single line such as P tag
Inline elements do not occupy a single line such as a font tag
2. According to the layout of the label can be divided into single-label and double-label
Double label <*></*>
Single label <*/>
Basic tags and Their properties
1.body Label
<body text= "Font Color" bgcolor= "background color" background= "path/background picture" >
Web page display content
</body>
Note: background color and background image exist at the same time, background color will be overwritten, the background image is higher priority
2. Title Label
3. Paragraph labels
<!--The p tag is a paragraph tag that allows the text to form a paragraph -<PAlign= "Left">Want to become a hacker need to learn C + + and assembler</P><PAlign= "Center">C + + is commonly used to develop large games</P><PAlign= "Right">Compilation is the base language of man-machine</P><!--no Align property default left -<P>Java's standard database for Oracle to develop large Web sites</P><!--only one space is recognized between the text in the HTML page, if you want to have more than one space -<P> The standard database for PHP is MySQL for developing lightweight web-based learning<Web Front End>Students must learn the JavaScript code♣</P>
4.font Label
<font color= "Blue" size= "+3" face= "Arial" > Attributes are font color, font size, font style </font>
Note: The properties of the HTML tag are for your own use only [not universal]
Wrong wording: <p face= "Chinese Choi Wan" > </p>
5. Other labels
Line Wrapping Labels
<br/>
HR Horizontal label width= "width"
I label make text italic
<i> Tilt </i>
<em> also tilt </em>
b tags make text bold
<b> Bold </b>
<strong> is also bold </strong>
Big tags let text zoom in, small tags to make text smaller
<big> Zoom in </big>
<small> Zoom out </small>
Underline label
<u> Underline </u>
Superscript subscript Label
H<sub>2</sub>o H2O
3<sup>5</sup> 35
Highlight Labels
<mark>java</mark>
Scrolling labels
<marquee>java China's largest background programming language </marquee>
Pre tag
Pre as output: The layout of the text is output on the mesh as is
<pre>
*
** *
* ***
</pre>
Embed label
Insert Picture
<embed src= "picture. jpg" width= "height=" ></embed>
Insert Flash
<embed src= "**.swf" width= "height=" ></embed>
Flash is a vector graph, will not be blurred with amplification, flash definition width and height if the size of the original file is larger than the white area to compensate
Insert Music
<embed src= "Music.mp3" width= "height=" ></embed>
Insert
<embed src= "Video.mp4" width= "height=" ></embed>
The width and height of the video definition can be offset by a black area if it exceeds the size of the original file.
Note: The high version of the Fox Fire is already very incompatible embed
Video and audio tags
Controls= "Controls" audio interface
autoplay= "AutoPlay" Auto play
<video src= "Video.mp4" controls= "Controls" ></video>
<audio src= "Music.mp3" autoplay= "AutoPlay" controls= "Controls" ></audio>
For the use of labels
A simple page design
<!DOCTYPE HTML Public "-//W3C//DTD XHTML 1.0 transitional//en" "http://www.w3.org/TR/xhtml1/DTD/ Xhtml1-transitional.dtd "><HTMLxmlns= "http://www.w3.org/1999/xhtml"><Head><Metahttp-equiv= "Content-type"content= "text/html; charset=utf-8" /><title>Makeup</title></Head><Bodytext= "#6D91AF"background=".. /day01/img/43_131752_c71828385a01522.jpg "><Marqueebgcolor= "Yellow"> <P> <FontColor= "Red"> <b>Song name:</b> </Font> <b><<Makeup>></b> </P> <Audiosrc=".. /day01/img/Xu Song-makeup. mp3 "AutoPlay= "AutoPlay"Controls= "Controls"></Audio> </Marquee><HRColor= "Red"width= "+"Align= "Left"/><b> <P> singing: Xu Song, He Manting</P> <P> <I>Arrangement: Zhe</I> </P> <P> <u>Release time:</u> <FontColor= "#00FF00">2010</Font>years</P> <P> <FontColor= "Red">Publisher:</Font>Beijing<FontColor= "#0066FF">China</Font>Yi</P></b></Body></HTML>
Getting started with front-end HTML
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
