Self-study Html--one

Source: Internet
Author: User
Tags html header

I.. the difference between. html. htm. shtml Three:
1. The. htm and. html do not differ in nature, representing the same file, but only for different environments.
2, DOS can only recognize 8+3 file name, so *.htm naming method can be DOS recognition, and *.html file naming mode cannot be recognized.
3. In UNIX systems, the Web page must use the. html extension, if it is an HTM, the source code appears when opened in the browser, and two extensions are supported in Windows. It can also be said that the HTM and HTML are the products of Windows and Unix confrontation.
4, if there is index.html and index.htm in the Web page, this is the browser will first explain index.html.
5.. shtml is a file that is used for SSI (server Side include servers-side include) technology, a feature that the Web provides on the server, and is executed on the server side. In general, to complete more complex tasks (such as: Chat room/message book, etc.), you must design a special CGI or ASP program, but if you just want to add simple features to the Web page (such as: Display a document, Web server environment variables, about the document update date/size, etc.), as long as SSI can complete the

Second, HTML development environment: font, SUBLIME,FIREFOX,FIREBUG

Iii. Understanding the constituent structure of HTML
<doctyp...>
<body>
</body>

1, Doctyp: This is very important, this declares the type of document, the most commonly used is
Strict
*<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 strict//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-Strict.dtd" >

*<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">

*<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 framese//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd" >

2. The difference between XHTML and HTML

The difference between HTML and XHTML can be roughly divided into two broad categories: one is the difference in function, the other is the difference between writing habits. The difference in functionality is that XHTML is compatible with major browsers, mobile phones, and PDAs, and browsers can compile Web pages quickly and correctly.
Because XHTML has a more rigorous syntax, if you are an HTML writer who is used to loosely structured, you need to pay special attention to the rules of XHTML. But don't worry too much, because the rules of XHTML are not too difficult. Here are a few easy-to-make mistakes for everyone to cite.

All labels must be lowercase
In XHTML, all labels must be lowercase, not case-insensitive, and not all uppercase. See an example.
Fatal error:Correct:
The labels must be paired.
such as <p>...</p>, <a>...</a>, <div>...</div> tags, etc., when a label appears, must have a corresponding end tag, indispensable, Just like the parentheses in any programming language.
Error: Hello <p> i am Muki
Correct:<p> everyone good </p><p> I am muki</p>

Label order must be correct
Labels from outside to inside, layer by layer covered, so suppose you write div first write H1, end will write H1 after writing Div. Just remember a principle of "advanced out", first pop the label to the end.
Error:<div>Correct:<div>
All attributes must use double quotation marks
In XHTML 1.0, a single quotation mark cannot be used, so you have to use double quotes throughout the process.
Error: <div style=font-size:11px>hello</div>
Correct: <div style= "font-size:11px" >hello</div

Target= "_blank" is not allowed
Starting with XHTML 1.1, the target property is completely banned, and if you want to have the ability to open a new window, you have to rewrite it to rel= "external" and work with JavaScript to achieve this effect.
Error: <a href= "http://blog.mukispace.com" target= "_blank" >muki space</a>
Correct: <a href= "http://blog.mukispace.com" rel= "external" >muki space</a>



3, the type of DOCTYPE
By default, the interpretation criteria for FF and IE are not the same, that is, if a webpage does not declare doctype, it interprets the following HTML as the default DOCTYPE. In the same standard, different browser interpretation models are different, if the declaration of standards, do not need me to say, you can do it yourself. Learn about Web standards, browser compatibility, where to start your own decision, but, please know doctype.

What is DOCTYPE
DOCTYPE is a shorthand for document type, which is used in pages to specify the version of XHTML (or HTML) used by the page. An essential key component to creating a standard-compliant page is the DOCTYPE statement. Only if a correct doctype,xhtml is identified and the CSS is in effect.

Choose what kind of doctype
There are 3 types of DTD (document type definition) declarations in XHTML 1.0 that can be selected: transitional (Transitional), Strict (Strict), and Frame (Frameset).
There are also 3 DTD (document type definition) declarations in HTML4.01 that can be selected: Transition (transitional), Strict (Strict), and Frame (Frameset).
The HTML 5 declaration is simple <! DOCTYPE Html> Now the mainstream browser is using this declaration, because HTML 5 is not SGML-based, so you don't need to reference the DTD, but you need to DOCTYPE to regulate the browser's behavior (let the browser run the way it should).
1. Transition of
A less stringent DTD that allows the use of HTML4.01 's identity in the page (conforming to the XHTML syntax standard). The syntax for the transition DTD is as follows:
"Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
2. of strict
A strict DTD that does not allow the use of the identity and attributes of any presentation layer, such as. The syntax for a strict DTD is as follows:
"Http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" >
3. Framework of
A DTD used specifically for frame pages, which is used when the page contains frame elements. The syntax for a framework's DTD is as follows:
"Http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd" >
Using a strict DTD to make a page is, of course, the ideal way. However, for web designers who do not have an in-depth understanding of web standards, it is more appropriate to use a transitional DTD. Because this DTD also allows the use of the identity, elements, and attributes of the presentation layer, it is more appropriate for most web authoring staff.

XHTML 1 is XML for HTML 4.01 and is a non-forward compatible format.
The DOCTYPE in HTML 4.01 requires a reference to the DTD because HTML 4.01 is based on the standard Common Markup Language for SGML (generalized Markup Language).

Use div to block, layout, and CSS to control code examples:<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 strict//en" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" >
http://www.w3.org/1999/xhtml" lang= "ZH-CN" >

<title> using CSS to control </title>
<meta http-equiv= "Content-type" content= "text/html; charset=utf-8" />
<meta name= "description" content= "Give me a new object Http://www.cnblogs.com/HOYF"/>
<style>
div{
height:200px;
Background:blue;
 }
#main {
Background:green;
 }
#footer {
Background:gray;
 }
</style>

<body>
<div id= "header" ></div>
<div id= "main" ></div>
<div id= "Footer" ></div>
</body>
Question 1:css How many methods are introduced? Three, first: most commonly used, introduce style sheets, write styles in style sheets, introduced in the following ways:
<link href= "css/style.css" rel= "stylesheet " type= "Text/css" >The second kind: in the HTML header with <style></style> wrapped up, in this face writing style:
<style type= "Text/css" >
*{
padding:0;margin:0
}
</style>The third type: write inline style directly inside the tag.
<div style= "color: #333" ><div>
Question 2:div What control can you declare except that you can declare the ID to control it?A div can also use class to give it a name, in addition to a name given to it by its ID. You can also use a style directly to set its style without giving it a name.
The only difference is that the ID is unique and can only be used once. Instead, classes can be reused, and you can use class to define styles when multiple div is the same.
General JS commonly used ID, because JS is to get the div name to make judgments, but also the only judgment, if using class will be wrong, if we write ordinary HTML, with class will be better oh。 Question 3: How do I make 2 div display side by side?Folat, floating layout

Self-study Html--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.