Home > Developer > Web Develop
As a new procedure rookie, do not know where to start to learn good, the predecessors have said that HTML CSS specification is a very need to pay attention to the point, I write down, specially transferred to save a bit, we learn from each other
General
Since this specification is a development specification, but also a script language to see, this specification is not an intact and must be strict compliance with the provisions, specific circumstances to the spirit of convenient use, to do the flexibility. However, please do not change the specification easily. In case of any problems, please contact me in time, I will promptly change this specification of the coherent code samples and documents.
/Basic Requirements
1. Open the images Common temp three subdirectory in the root directory of the website, according to the need to open the media subdirectory, images in the directory of different columns to use the public picture of the target layout, such as the company's symbols, banner, menus, buttons and so on; common Sub-directories in the CSS, JS, PHP, include and other public files, temp sub-recording customer supply of various text pictures and so on raw materials; Media subdirectory put Flash, AVI, quick time and other multimedia files.
2. In the root directory should be in accordance with the column structure of the first page, to each column to open a directory, according to each column must be in the target directory to open a images and media sub-dial to place this column proprietary pictures and multimedia files, in case this column 礓 more, and many subordinate columns , the other directories can be opened accordingly.
3. The files in the temp directory are often comparable, advocating for the use of time to set up a catalogue, the customer will supply the materials sorted.
4. Unless there is a specific situation, the catalogue, the name of the document is full of lowercase English letters, numbers, underscores the combination, which must not include Chinese characters, spaces and specific characters; The naming of directories please try to use English as a guide, not the last resort to pinyin as a catalogue, printed verification, A directory named after one months is often not read,
/scripting
We should have a script. The concept of a unified style, meaning that one months later and one months ago, you write a script style consistent unity, and unified Team of different developers writing script style adhere to unity, because we can not forever lonely development, You will always be able to cooperate with yourself three months ago (your customer is asking for a revision), and often you have to develop a project with different comrades in the studio, and you may be asked to revise a script that has been developed by a former person, but you may also throw a project to the comrade thereafter.
1. Common templates for Html files:
<!--
Generator:sub Design Studio (n)
Creation Data:2000-8-1
Original Author:eastline
-
<title> Documentation Topics </title>
<meta http-equiv= "Content-type" content= "text/html; charset=gb2312 ">
<meta name= "Author" content= "Eastline" >
Other META tags
<link rel= "stylesheet" type= "Text/css" href= "Style/style.css" >
Style table Definition
Client-side JavaScript function definition and initialization of monopolies
<body bgcolor= "#ffffff" >
... ...
</body>
Compensation:
To ensure that the Web site can be accepted with the next generation of Web language XML specifications, all HTML tag attributes are enclosed in single quotation marks, i.e. we should write <a href= "url" > instead of <a href=url>
2. Approve the layout of the full-text search, in order to enable the search engine on the Internet to work, the keywords and description meta symbols should be added between the
<meta name= "keywords" content= "Orient Shinkansen, car, buy car" >
<meta name= "description" content= "Orient New Drive Line, global Chinese car News First stop" >
3. CSS file Style Sample code:
<style type= "Text/css" >
<!-
p {text-indent:2em;}
Body {font-family: "Song body"; font-size:9pt; color: #000000; margin-top:0px; margin-right:0px; margin-bottom:0px; margin-l eft:0px}
Table {font-family: "Song body"; font-size:9pt; line-height:20px; color: #000000}
a:link {font-size:9pt; color: #FFFFFF; Text-decoration:none}
a:visited {font-size:9pt; color: #99FFFF; Text-decoration:none}
a:hover {font-size:9pt; color: #FF9900; Text-decoration:none}
a:active {font-size:9pt; color: #FF9900; Text-decoration:none}
a.1:link {font-size:9pt; color: #3366cc; Text-decoration:none}
a.1:visited {font-size:9pt; color: #3366cc; Text-decoration:none}
a.1:hover {font-size:9pt; color: #FF9900; Text-decoration:none}
a.1:active {font-size:9pt; color: #FF9922; Text-decoration:none}
. Blue {font-family: "Song body"; font-size:10.5pt; line-height:20px; color: #0099FF; letter-spacing:5em}
-
</style>
This is especially important to watch out for a:link a:visited a:hover a:actived
The order must be strictly according to the sample code above, or more or less will be problematic. In addition to our statutory redefinition of the first, pseudo-class second, custom finally, easy for themselves and others to read!
In order to ensure that the different size of the expo is consistent, the font size advocated by the point pt and Pixel px to define, PT lightly use the Chinese song Body 9pt and 11pt,px lightly use Chinese song body 12px and 14.7px This is through the optimization of the font size, bold words may italicized word bold, Easy to dial 11pt and 14.7px font size compared to light.
When writing <table> nesting with each other, strictly according to the specification, for a single <table>,<table><tr> aligned,<td> indent two half-width spaces,<td> In case there is a nested table,<table> also indents two half-width spaces, in case <td> has not had any nested table,</td> end symbol should be in line with <td>, do not wrap,
As we are careful, there should be no such code in the source code:
<td>
</td>
And that should be the way it ought to be:
<td></td>
This is because the expo will feel the equivalent of a half-width space, the above is not a standard notation equivalent to inadvertently add a half-width space, in case indeed have to add a half-width space, should be so written:
<td> </td>
The <table> of one level of the system is left aligned, and the empty cell without any content is not approved, and cells with a height greater than or equal to 12px should be written between <td> and </td> if the height is less than 12px, it should be in the & Insert a 1*1-sized, transparent GIF image between Lt;td> and </td>, because some of the Expo players feel empty cells are illegal and do not give an explanation. In case the code order is messy, in the DW3 can cross command->apply souce formatting to hold the reorganization!
5. Width and height of the writing also have a uniform specification, under the circumstances, only one column of the table, width written in the <table> label, only one row of the table, height written in the <table> label, multiline multi-column table, Width and height are written in the first row of the <td> tag that may be the first column. In short obey a sense of propriety: do not reveal more than one of the containment system a cell size of height and width, the mystery of the sea to ensure that any width and height are useful, and even if you modify any of the code width and height of the value, you should see the changes in the expo. To do this is not imprudent, it must be more than a man's practice and pondering.
/General principles
1. Before arranging the form, please be sure to think about one of the best plans, the nesting of the table as far as possible to curb within three levels, and should try to avoid the <colspan> <rowspan> two symbols, experience has clarified that these two symbols will bring a lot of tedious.
2. A Web page to avoid using a full-size table, all the content is nested in this large table, because the Expo is in the interpretation of the elements of the layout is a form of disclosure, in case a page is nested in a large table, it is likely to constitute a harvest even when the expo-typed web site, He had to face a blank first, man, and then all the Web content was revealed at the same time. In case you have to do this, use the <tbody> symbol so that it can be revealed in chunks of this large form.
3. In typesetting we often encounter the need to hold the first line of indentation, do not use the possibility of full-width empty glyd to reach the harvest, the standard practice is to define p {Text-indent:2em in the style table;} then add <p> symbol to each paragraph, beware, under the circumstances, please do not omit < /p> End sign.
4. In the sense of propriety, we curb the use of to the size of the image revealed, but also advocates labels do not bring width and height two properties, this is because in the manufacturing process, pictures are often necessary to repeat the correction, so as to avoid the size of the image revealed by the human, As much as possible to display the function of the Expo, but such a side effect is that when the page does not load the picture, will not leave the image of the position size, may constitute a Web page in the loading process jitter (if the picture is inserted in a quiet size of the table, there is no such illusion), especially when the size of the picture is large, This illusion will be obvious, so when you expect this will show that the Web page jitter will occur, please be sure to attach the width and height property at the end of the .
5. In order to maximize the ability to display the active layout of the Expo, in a comprehensive text, please try not to use <br> to manually intervene in segments.
6. There should be a half-width space between the words in different languages, but before the sign of the head and the sign of avoiding the tail, the punctuation between the Chinese characters should be used with full-width punctuation, and the English letters and the square brackets should use the half-angle brackets.
7. All the font size should be used in the style table to end, to curb in the layout revealed <font size=?> symbols.
8. Please do not continue to reveal more than one in the Web page and try to minimize the use of full-width space (the English character set, the full-width space will be garbled), the blank should try to use text-indent, padding, margin, hspace, vspace and transparent GIF pictures to end.
9. When mixing in English and Chinese, we define as much as possible the English and the numbers as Verdana and Arial two fonts.
10. Line spacing is defined as a percentage, and the value of the two leading lines commonly used is line-height:120%/150%.
11. The path in the site is full approval of the relative path, and the link path to the default file that is linked to a directory does not need to be written, as we do not need to: <a href= "aboutus/index.htm" > should be so: <a href= "aboutus/ ">
12. Embed graphic text with larger fonts, advocating that you do not include text in the graphic.
13. "Page size" is defined as the sum of all the file sizes of a Web page, including HTML files and all embedded objects. Users are obsessed with the fast rather than the novelty of the site. For demodulator users, the page size persists below 34K for portability.
/Document naming principles
1. Each directory should include a default HTML file, the file name is unified with index.htm
2. A combination of lowercase letters, numbers, and underscores in a uniform case.
3. The idea of naming the sense of propriety is to make yourself and each member of the Working Group to be able to properly identify the meaning of each document, and secondly, when we use the "list by name" Call in the folder, the uniform types of files can be arranged at the same time, so that we find, fix, rotate, calculate the amount of load and so on
4. The following section of the "News" (including "domestic News" and "international news") explains the HTML file's naming propriety:
☆ Open News directory under the root directory
☆ First Default news name index.htm
☆ All the news that belongs to "domestic news" is named: china_1.htm, china_2.htm, ...
☆ All the news that belongs to "international News" is named: internation_1.htm, Internation _2.htm, ...
☆ If the number of files is two-digit, please name the first nine files: china_01.htm, china_02.htm to ensure all
Attempting to use the setvalues () measure to set a negative value can cause an aberration.
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
