Get a quick overview of common XHTML basics

Source: Internet
Author: User
Tags color representation

Operating effect:

<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd "> <!--start this part of the DOCTYPE line to understand, more information on their own Baidu. This finishing example focuses on standardizing the terminology expression, concept description and interpretation--<!--key concepts: [tag] ' [Property] ' [attribute value] ' [parameter] ' [ Parameter values].  XHTML writing specification: Label all lowercase, add a space from closed tags-<!--in advance: the equivalent semantics of the words appearing in the course of the explanation: "Elements"   <==>  " HTML tag pairs and closed text content by the tag "           " parameter " <==>   parameter variables             parameter values  <==>  Parameter variable value "-->

<!--Remember our format, start with

<!--body content starts, from the <body> tab, the content is displayed on the page, and all the information in the previous

 <!--The properties of text color, float, background color, font, etc. are unified by the label inline style "style" property management- <!--  Syntax structure:< label Tag property = "Property value: Parameter value; property value The parameter value; Tag Properties = "attribute value: Parameter value; property value;" > - <!--  Notice that multiple "label properties" are separated by a space, and multiple "attribute values" are separated by semicolons, The last property value's parameter value does not require a semicolon   <ul style= "Color:orange"   align= "center" >  <!--color is used to define the text color, The Align property value has three parameter values: Left/center/right, which defines the text within the element "left/center/right"- <!--Parent tag <ul> Specifies the font color orange, text centered. Sub-label <li > Inherit the attributes of the parent tag-- <li style= "float:left;list-style:none;width:100px" align= "center" > Start Network </li>  <!--The Float property value has left/center/right three parameter values that specify the floating position of the "element" (popularly speaking as the display position), noting that it is not the position of the text within the element,-->  <li style= "float : left;list-style:none;width:100px "> Home </li>  <!--list-style attribute values have circle/disc/square/none and many other kinds of parameters, Which takes the parameter value of none commonly used to remove <li> before the default solid circle--- <li style= "float:left;list-style:none;width:100px" > Navigation windows < /li>  <!--background-color attribute values are used to define the background color of the element, the color representation is rgb,16, system color name three main ways, see the following introduction-- <li stylE= "float:left;list-style:none;width:100px" > Leaderboards </li>  <!--width and Height property values are used to define the element width and height, respectively. Parameter value units are mainly pixel (pixel) and relative size (EM) Two--- <li style= "float:left;list-style:none;width:100px" > Open source code </li >  <!--All the elements are not defined in height, the system defaults to the size of the font. The system default font size is 16px-->  <li style= "Float:left;list-style:none; width:120px "> Event/Event entry </li> </ul> <br/> <!--Self-enclosed single label with a space before closing. Develop a good normative grammatical structure and <! --Small application: As in the example above, Float:left is often used to specify the horizontal arrangement of elements, it affects the elements behind the element also follows the element, so I added <br/>--> <!--color representation: [RGB mode]:   RGB is the Red-green-blue three primary colors of the collectively, through the different proportions of three primary colors to express different colors. The syntax structure is RGB (0~255,0~255,0~255), such as RGB (0,0,0) for black, which means that all colors are not taken. RGB ( 255,0,0) denotes red, which means only red. Of course. The blending ratio can also be expressed as a percentage. such as RGB (100%,0,0) is also red, when the value is 0 o'clock, the percent sign can omit do not write [16]:   "#" begins with "#rrggbb" The form of the 16-digit color, each of the value range is "0~f", the numeric size of the table color concentration, such as #ffffff to indicate the maximum proportion of each color, in addition, if #rrggbb each bit of the same value, can be abbreviated to #rgb. For example, it can be expressed as #fff, Represents White. #FF0000表示红色, Daniel #00ff00 Green .... [System color]:   is the name of the language system color values, common red|green|blue|orange|brown|gray|white|black and so many, most of the color has a name--> <!--unit conversion em & PX: The default size value for the display font size is 16px, so by default, 1em=16px--and <!--This is an example of a column that has no property adjustment--<ul style= " Font-size:2em "> <!--Font-size property values are used to define the size of the word, 2em=32px. Note that the definition of parent tag here is the quilt tag inheritance-- <li> home </ li>  <li> Hardware and operations </li>  <li> art and video </li>  <li> Mobile development </li>   <li> Front end </li>  <li> Web backend </li> </ul>

</table>

<form action= "handle_form.php/handle_form.jsp/handle_form.aspx" method= "POST" >     < Fieldset>      <legend>enter Your information in the form below:</legend>       <!--<label> typically defines the tag name for the input box, which acts as a secondary description-    <!--<input> tags are used to collect user input information, and various input forms can be provided, depending on the value of the type attribute. Also, note the self-closing specification--      <p><label> Username:</label><input type= "text" name= "name" size= "maxlength="/></p>       <p><label>password:</label><input type= "PassWord" name= "name" size= "MaxLength" = "/></p>"       <p><label>email:</label><input type= " Text "name=" email "size=" maxlength= "/></p>       <p><label for=" Gender ">gender:</label><input type=" Radio "name=" Gender "value=" M "/>male<input type="Radio" name= "Gender" value= "F"/></p>       <p><label>age:</label >        <select name= "age" >      <!---- >            <option value= "0-29" >uder 30</option >            <option value= "30-60" >between and 60</ option>            <option value= "60+" >over 60</ option>        </select>       </p>       <p align= "center" >  <!--want the element to be centered, you can take the attribute value in the parent label Definition Center---      <input type= "Submit" name= "submit" value= "Submit My Information" disabled= "false"/>       </p>     </fieldset> </form> <p align= "Center" > <!--want the element to be centered, you can take the attribute value in the parent label Definition Center--<a href= "#" style= "text-decoration:none;font-size:20px;color:# 9933fa;font-family: XXFarEastFont-Chinese cloud, Arial "> Back to Top </a> </p> </body>

Get a quick overview of common XHTML basics

Related Article

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.