Getting started with web pages and getting started with creating web pages

Source: Internet
Author: User

Getting started with web pages and getting started with creating web pages

Today is an introduction to web pages. To be honest, I don't really want to be a front-end engineer. Because those things will not achieve the corresponding effect according to my ideas. I just want to make a rough idea. I want to do backend development. The server side is very happy. If you have android, you will be happy.

 

Now, just write some corresponding attributes:

1. Basic attributes:

<Font> font labels. You can specify the font style, color, and size attributes. </font>

<Br/> press enter to wrap the line

<I> italics </I>

<U> underline effect </u>

20 <sup> 2 </sup> can be used to display the effect of 20 square meters.

H <sub> 2 </sub> O can be used to display the effect of water molecules.

<S> strikethrough, or cross-line </s>

<P align = "left">

The Section has the attributes of automatic line feed. We have added a left-aligned method.

</P>

<P align = "center">

This section is centered and aligned

</P>

 

2. hyperlink

The label <a> </a> anchor indicates a link operation, and href indicates that we will obtain a place, you can add corresponding content between tags.

(1) text links

(2) image links

(3) links on the page

(1)

The content between tags is text links.

<A name = "Jump to the receiving location"> hello </a> <br/>

<A href = "chain 1.html"> album </a>

<A href = "link 2.html"> introduction </a>

<A href = "Write logs first if no fixed position is available </a>

<A href = "# indicates the current page"> message board </a>

<A href = "#"> personal center </a>

<A href = "3"> system Settings </a>

(2)

The content between tags is an image link if it is an image.

<A href = "index.html"> </a>

(3)

Page Link, click this link to return to the corresponding location of the current page

<A href = "#"> if it is only a #, return to the top of the page </a> to the top of the current page.

<A href = "# Jump to accept location"> If the href is followed by the # sign and # is followed by the name value of a tag element, then it will jump to the corresponding location </a>

 

3. Combination of Image and map:

 

<Map id = "planetmap">

<Area shape = "rect" coords = "0, 0, 82,126" href = "sun.htm" alt = "Sun"/>

<Area shape = "circle" coords = "90,58, 3" href = "mercur.htm" alt = "Mercury"/>

<Area shape = "circle" coords = "124,58, 8" href = "venus.htm" alt = "Venus"/>

</Map>

This is an example in the official document. Note that google chrome and 360 do not support only ie display, and I do not know the version of ie. Wow! It turned out to be version 11.

 

 

This is something the teacher did not make.

 

4. Scroll Area

The same property is blocked in 360 and cannot be displayed, but can be displayed in ie.

<Marquee behavior = "alternate" direction = "up" bgcolor = "blue" height = "200" width = "200">

Scroll Area

</Marquee>

The instructor explained this clearly. I will not repeat it too much.

Simply copy a reliable example.

<Marquee>... </marquee>

<Marquee> move text! </Marquee>

Direction <direction =#>#= left, right

<Marquee direction = left> La la, I am moving from right to left! </Marquee> <P>
<Marquee direction = right> La la, I move from left to right! </Marquee>

La la, I move from right to left!

La la, I move from left to right!

Method <bihavior =#>#= scroll, slide, alternate

<Marquee behavior = scroll> La la! </Marquee> <P>
<Marquee behavior = slide> La la, I just took a rest! </Marquee> <P>
<Marquee behavior = alternate> La la, let's go back and forth! </Marquee>

 

5. List

Ordered list, unordered list. List items.

Pay attention to the hierarchical nesting relationship. Here we will not talk too much about it. When creating an electronic notebook, you can practice it in detail.

<Ul type = "circle">

<Li> Water Margin </li>

<Li> Romance of the Three Kingdoms </li>

<Li> Travel Notes to the west </li>

<Li> Dream of Red Mansions </li>

</Ul>

<Ol type = "B" start = "2">

<Li> demon catch </li>

<Li> Hong Kong Region </li>

<Li> Charlotte's troubles </li>

<Li> wait for your shot to be </li>

</Ol>

List nesting:

<Br/>

Chinese province:

<Ul>

<Li> Beijing </li>

<Ol>

<Li> Haidian </li>

<Li> Chaoyang </li>

<Li> Changping </li>

</Ol>

<Li> Hebei

<Ul>

<Li> Shijiazhuang </li>

<Li> Zhangjiakou </li>

<Li> Baoding </li>

</Ul>

</Li>

<Li> Henan </li>

</Ul>

 

 

6. Table

I have done some things with it, and I will not repeat it too much here.

Cellspacing refers to the distance between cells.

Celladding refers to the distance between the content of a cell and the cell border.

 

The content in the Body is displayed as follows:

<Body topmargin = "0"> use the topmargin attribute and set it to 0.

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.