PHP notes (HTML article)

Having learned a lot of languages, I finally decided to learn PHP recently.

Learning PHP, first of all to learn HTML, then, I also start from the HTML!

Learn any programming language first, read more books, you can not do without it--help document

HTML Help document: Http://pan.baidu.com/s/1hqxOymo

Do not say do not know, in recent years, compare Fire HTML5, is a development direction of HTML, HTML development direction, such as, one side is a plurality of HTML5, the other side is the normalization of XML, the process also derived xhtml!

Do Web pages, always avoid the use of color, color has two representations, word notation and hexadecimal notation, in which the hexadecimal representation of the color comparison, I also organized a blog post for viewing.

RGB Color Table: http://blog.csdn.net/u010849590/article/details/43339473

Programming languages There are always some special symbols can not be directly displayed as text, HTML is no exception, these special symbols in the HTML is called entity, Bo Master also organized an HTML entity table, for a rainy day.

Entity Comparison table: http://blog.csdn.net/u010849590/article/details/43380181

Web page code is directly parsed by the browser, writing a Web page must choose a code, commonly used encoding has UTF-8, GBK, GD2312, and so on, and the browser can choose a code to parse the page. So, the question is, what if the browser chooses the encoding and the coding of the page is inconsistent? There are three ways to solve this problem:

1. Use the most people-encoded way to fit the browser
2. Set the browser's encoding to fit the Web page
3. Use <meta/> tags

Obviously, a code can not be suitable for everyone, and let the user to modify the browser encoding is not smart enough, so the first two are a palliative, the third method is kingly.

<meta/> is a single label, and its usage is

<meta http-equiv= "Content-type" content= "text/html;charset= encoded form"/>

Take UTF-8 as an example:

<meta http-equiv= "Content-type" content= "Text/html;charset=utf-8"/>

For other uses of the <meta/> tag, you can view the Help documentation.

<base/> tags can set hyperlinks, such as changing relative paths to absolute paths, open methods, and so on. <base/> is a single label, and its specific usage can refer to the help documentation.

<body> 's property settings default to the entire page's default settings, you can set the font color (text), background color (bgcolor), background picture (background), background properties (bgproperties), and more, or view the Help document!

<p> is a paragraph label, this label is special, can be used as a single label can also be used as a double label. When used as a double label, the content between the labels is displayed as a paragraph, and the line breaks from the label as a single label. The use of double-label is relatively standard, but also more common.

<pre> label is a double label, the text in the label will be output in accordance with the original format, and <xmp> different,<pre> tags within the label can be parsed, and <xmp> inside the label is not resolved, in the form of text output!

<li> tags with <ol> and <ul> use,<li> as List label, double label, content between tags as an item in the list, default unordered;<ol> tag with < Li> tags, make the list an ordered list;<ul> label with <li> use as an unordered list group. The properties of these tags can be viewed in the help documentation.

<sub> and <sup>, subscript labels and superscript labels are double-labeled.

is called Image label, used for displaying pictures, setting picture link for single label, SRC attribute, Title property setting the name displayed when the mouse is placed above, Alt property setting picture loading failure display name. Additional properties can be found in the help documentation.

<a> is a link label for a double label for hyperlinks. The href attribute sets the link address, the Title property sets the name to display when the label is placed on it, the target property sets the way to open the link, and other properties to view the Help document .

<a> tags set anchor points for linking to specific areas, with the Name property. Name set a name, thehref property is set to "#" + name, you can link to this page name, and if thehref is set to the name of the page path + "#" +name, you can link to the page name where it is located When the Herf property is set to "#" or empty, jump to the header of this page.

Current Page Jump

Jump to another page

URL: Uniform Resource Locator

URL composition: Take http://i.cnblogs.com/EditPosts.aspx?postid=4275104&update=1 as an example

• Protocol Name:/HTTP, ftp://, https://, file://, etc.
• Host Name: (i.cnblogs.com) (cnblogs.com is the domain name)
• Port number: 80, 8080, etc. (range: 0~65535) (80)
• Resource Name: Accessed file (editposts.aspx)
• Parameter: "?" The following key-value pairs, multiple parameters with "&" connection (get parameter, parameters visible; Post parameters, parameter not visible) (postid=4275104&update=1)

Relative path to URL:

• ./: Represents a local path
• .. /: Represents the parent path
• .. /.. /: Represents the upper ancestor path (and so on)

<table> tags are used to build tables for double tabs. The Width property sets the table's widths, the Heigth property sets the table's height, the border property sets the table's border, the CellSpacing property sets the width between the cells, and the CellPadding property sets the distance between the cell contents and the border.

<tr> Tag nesting <table> label use, for designing table rows, for double labels.

<td> Tag nesting <tr> label use, used to represent the table cell, is a double label. The RowSpan property sets the number of rows spanned, the property value represents the span of the row, the Colspan property sets the span column, and the property value represents the number of columns spanned.

<th> tag nesting <tr> tags used to represent the table header, the contents of the cell font bold, centered.

More properties can be found in the help documentation.

The HTML frame, also known as a sub-frame, will combine multiple pages into a single page display.

• Advantages:
  • When you reload a page, you don't need to reload the entire page, increasing the speed of the page download
  • Easy to make navigation bar
• Disadvantages:
  • Multiple pages, difficult to manage
  • The code is complex and cannot be indexed by the search engine
  • Multi-frame pages increase HTTP requests from the server
  • Small mobile devices are not fully visible
• Because of the above shortcomings, does not conform to the standard web design concept, has been abandoned, but the background can be used, so, or to learn.

Tags for frames:

• <frameset> label, double label
  • <frameset> tags instead of <body> tags, define frame pages, so use <frameset> tags without <body> tags
  • Border property sets the size of the frame border
  • The Rows property sets the number of rows and the height of the frame, how many rows are required to write the size of the rows, "*" for the remaining space, separated by ","
  • The Cols property sets the number of columns and widths of the frame, how many columns you want to write, and "*" indicates the remaining space, separated by ","
  • <frameset> can be nested to use, so that the frame format diversification
• <frame> label, double label
  • Used to display the contents of each page, nested in <frameset>;
  • The SRC attribute sets the path to the page to display its contents
  • The Name property allows you to set the title of the frame for the link to display
  • The target property of the <a> tag specifies the frame on which the page will be displayed
  • When the target property of the <a> tag is set to "_parent", it indicates that the top-level frame is displayed, and when set to "_top", indicates that the

Layout DisplayHypertext Links

• <noframes> label, double label
  • When the browser fails to load the frame, the contents of the <noframes> tag are displayed
  • Nested in <frameset> tags, with <body> tags
• <iframe> labels, single label
  
  
  • Create an inline frame that contains another document
  • The contents of which can be displayed in browsers that do not support the label
  • Use in <body> tags

See the Help documentation for additional properties and usage of the framework!

Forms: HTML elements that can transfer input data to a server-side program

• <form> label, double label
  • Represents an HTML form
  • The Action property sets the destination of the data transfer
  • The method property sets the transfer mode, which can be set to get and post
    • Get transfer information is less, faster, submission information will be displayed in the Address bar, unsafe
    • Post transmission More information, slow, submission information will not be displayed in the Address bar, more secure
  • Enctype property sets the type of encoding that data is sent to the server
    • application/x-www-form-urlencoded: Form data is encoded as a name/value pair, the default value for the standard encoding format
    • Multipart/form-data: Form data is encoded as a piece of information, each control on the page corresponds to a portion of the information, and the file is uploaded using

• <input> labels, single label
  • Type, which represents the display of an input field (input type, select type, click Type)
    • Text, single-line text input field, input type
    • Password, password input field, input characters are displayed as "*", input type
    • File, document upload, input type
    • CheckBox, check box, select Type
    • Radio, single-box, selectable
    • Hidden, hidden fields, typically used to pass default values,
    • button, buttons, click Do not submit form, can do other actions, click Type
    • Image, Image button, click to submit the form, click Type
    • Submit button, click to submit the form, click on the type
    • Reset, reset button, click Type
  • Name, names of form items
    • Usually set to the same field name as in the database
    • Click Type does not require this property
    • Identifier at the time of data transfer
    • The name value of the check box is typically used as an array representation
    • Options are mutually exclusive when the name value of the radio box is the same as the
  • Value of the table item
    • Select to set the property value and, when selected, transfer it with the form
    • Click Type except image, set this property, that is, set the button display name
    • input type set the property value, set the default value value
  • MaxLength, restricting text input length
• <textarea> label, double label
  • Multi-line Text field, multiple lines of text can be entered
  • cols, setting the number of columns, by number of columns, setting the width
  • Rows, setting the number of lines, setting the height by the number of rows
  • The remaining properties are consistent with the <input> tag input type
• <select> label, double label
  • Drop-down menu
  • The Name property sets the table item names, usually consistent with the database field names
  • Multiple property setting form is multi-select
• <option> label, double label
  • Nested in <select> tags, representing an option for the drop-down menu
  • The Value property sets the values of the options, after selection, with the form transfer
  • Selected property setting is selected by default
• <lable> tags can be set text and options binding, to click on the text to select the role

For additional properties and usage of the form, you can view the Help documentation!

<div> label, double label

• Layer labels, for locating elements or layouts
• The contents of the layer can be placed anywhere in the browser and can be placed into HTML elements
• Often used in conjunction with CSS

Because it is often used in conjunction with CSS, learn css in depth!

At this point, the basic elements of HTML has been learned, you can start to create a simple static Web page, but the dynamic site is still far away! Then come to learn CSS!

PHP notes (HTML article)