Java Web: HTML entry and common tags, and Java Web entry tags

Source: Internet
Author: User

Java Web: HTML entry and common tags, and Java Web entry tags


Overview and functions of HTML:

HTML is called HyperText Markup Language. It is a descriptive Markup Language used to describe the display of content in HyperText. Such as the font color and size.
Html is short for Hypertext Markup Language and the most basic web page language.
Html is a language defined by tags. The code is composed of tags.

Basic HTML format:

A: By observing the format, we find that
The Html code starts from The header adds some auxiliary or attribute information to the Html page, and the content in it is first loaded.
The body is the place where the page data is actually stored.

B: Format explanation
Html: it is placed at the beginning of an html file, but there is no substantive function. Even if this tag is not available, the browser will parse other html tags.
The browser has a built-in html Parser.
You can set the default browser to open: tool-Folder option-file type
Head: indicates the header flag that stores information about the html file, such as providing indexes and defining css.
Title: The title tag, which is included in the head tag. It is used to set the webpage title.
Body: The body Tag. The content to be displayed on the webpage is placed in this tag.

* Ends with .html#.htm.
* The browser can parse HTML files.


HTML considerations:

Generally, labels start and end with a single function. They can end in a tag.
Change attributes to achieve good Display Effect
Attribute values can be double quotation marks, single quotation marks, or no quotation marks. Generally, double quotation marks are used, or according to company specifications.

* MyEclipse
* Set the workspace encoding.
* Window-preferences-General-workspace-select the encoding of the UTF-8
* Window-preferences-MyEclipse-Files and Editors-HTML-encoding modified to UTF-8
* Window-preferences-General-Editors-File Associations-select *. html-select MyEclipse HTML Editor-select default-Select OK

* HTML tags
* Typographical labels
* Line feed labels <br/> (rarely used)
* Horizontal line * Attribute: color
* Color writing: there are two ways: 1) English words of color 2) red green blue # ffffff
* Attribute: width
* The value can be written in either of the following ways: 1) pixel value (30% px) 2) percentage)
* Difference: the percentage changes with the browser size, and the pixel does not.
* Space: & nbsp;
* Section labels (relatively many)
* <P> </p>
* Feature: A blank row is generated at the start and end positions.
* Attribute: align

* <Div> </div>
* <Span> </span>
* The label is very simple, that is, to declare a region on the browser.
* Difference: there is a line break behind the div, and there is no span.

* Block-level and intra-row elements (for more information)

* Font labels
<Font> </font> (important)
* Color: color
* Size: font size
* The maximum and minimum values are 7 and the minimum value is 1.
* The default value is 3, and the size statement provides (+ 2)
* Face: font type

* Title tags (rarely used)
* <H1> ...
* <H6> * Gradually decreases from 1 to 6.

* Bold and italic labels
<B> </B>
<I> </I>

* Labels can be nested.
<B> <I> </B>

* Special characters in HTML
<: & Lt;
>:& Gt;
&: & Amp;

* Scroll Subtitles (forget it)

* List tags
* Format the data in the specified format.

* List tags
<Dl> (rarely used)
<Dt> upper-level project </dt>
<Dd> lower-level project </dd>
<Dd> lower-level project </dd>

* Dd labels: Default indentation and automatic alignment.

* Ordered list and unordered list
Ordered: (too many)
<Li> </li>
* Attribute: type
Where does start?

Unordered: (many are used)
<Li> </li>
* Attribute: type

* Use <li> </li> for intermediate data entries, whether in order or out of order.

* Image Tag (important *****)

* Attributes:
* Attribute: src = "image address"
* Width: The display width of the image.
* Height: the height of the image.
* Description of alt Images

* Hyperlink tags (important *****)
* <A> text content </a>
<A> </a>
* LINK Resources
* Attribute: href = "specify the address of the linked resource"
* Note: If network resources are connected, you need to write the protocol. If no protocol exists, the file protocol is used by default.
* Note: If the browser can parse the file, it will be opened directly.
* If the file cannot be parsed by the browser, the download window is displayed.
* Custom protocols
* If the browser cannot parse the protocol, it will find the application on the operating system.

* Target: the open location.

* Locate resources
* Professional term anchor
* Attribute: name

* Table label (*****)
Table label
<Table>: Declares the table range.
* Attribute: border = "1"
Width: The table width.
Height: height
Bgcolor: Background Color
Cellpadding: padding

<Caption> title </caption>
<Tr>: indicates the row of the table.
* Attribute: align of Text

<Td>: Cell
Property: width
Height: height
Merge cells:
Row merge: rowspan = "2"
Column merge: colspan = "2"
<Th> </th>: Cell

* Note: The difference between td and th is THAT th is centered and bold by default.

* Form tag (important **********)
<Form>: encapsulate the form range.
* Attribute: action = "request submission path"

Method = "form submission method"
* Interview questions: How can I submit a form?
* A: There are many forms to submit. There are two commonly used methods: get and post.
* Difference between get and post submission methods:
* When the get method is submitted, the data is displayed in the address bar.
* The post method does not.

* The security level is low when the get method is submitted.
* The post method has a high security level.

* The data size is limited when the get method is submitted.
* The post method does not.

* Form component of the input item
* Very important attribute: type, which provides components for different input items based on different type values.
* Column: <input type = "text"/>

Type = text input box
Type = password Input box
Type = radio button
* The property name is provided (the value of name is the same)
* Selected by default: checked = checked or true

Type = checkbox multiple choice button
* Selected by default: checked = checked or true

Type = select box for file
Type = hidden component
Type = button (the most ugly one in history)
Type = image has the same effect as the submit button.
Type = reset
Type = submit data

* Selection box
<Select name = "city">
<Option value = "bj"> Beijing </option>
<Option value = "sh"> Shanghai </option>

* Text Field
<Textarea rows = "" cols = ""> </textarea>


* Note: After clicking the submit button, the address bar sends a change (? Sex = on )*? Username = haha & sex = on
*? Username = zhangsan & pwd = 123 & sex = nan & love = SCSI

* The input tag must provide two attributes: one attribute name and the other value.
(*****) The name attribute must be specified, and the value depends on the situation.

* Framework labels (rarely used)
* Use <frameset> </frameset>. Note: you cannot use this label either inside or below the body tag.

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: 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.