An article teaches you how to learn HTML-HTML Tutorial-php.cn

html is the basis for learning to make web pages. Beautiful web pages and layouts are composed of some html codes. After reading this article, you can simply understand html. Write more and practice more. If you are not committed to If you become an artist, then as a developer, you can read HTML and make simple modifications when necessary. Follow my ideas below to ensure that this article will help you understand HTML. Of course, during the reading process, it is best to try it yourself, so that your understanding will be deeper. Ok, let’s start: (The following symbols are all entered in English)

1. Basic HTML rules

<html>
<head>
<title>我的网页</title>
………………………..
</head>
<body>
………………….
</body>
</html>

Copy after login

Almost all web pages are in accordance with This format comes from this, which is a mark that a web page must have. Each mark is placed in < What you see.

Copy the above code to a notepad, and then save it as a.html file. It will become a web page. Give it a try

Then, add the tag Homepage, save and see the effect again?

Are they the hyperlinks we usually see online? It's just that there is no change when clicking "Home" here, because the empty connection we added is to strike while the iron is hot. We follow the previous method to create a page, save it as b.html, and then replace the "#" above with b.html. Open it, click on the home page, and it will jump to page b. (Of course, pages a and b must be in the same directory.) By now, you should understand that in fact, all functions on the web page are implemented by different tags similar to . When you need to do Just remember the function of these tags.

2. Web page structure

If you pay attention when surfing the Internet, web pages are actually divided into blocks

You can also divide it into many blocks according to your needs , the main purpose of blocking is to modify aspects and determine their respective presentation styles.

This is mainly achieved through the

tag. Let me try adding the

tag to the "Home Page":

<div>
<a href=”b.html”>首页</a>
</div>

Copy after login

Save it and try opening it. Try it, what is the effect?

Is it still the same as before the modification? Let’s add some modifications to it:

<div style=”width:200px;height:100px;border-style:solid;” >

Copy after login

is running, and the block we marked is shown with a blue background!

You can split the web page into eight pieces by adding a lot of

blocks, haha, and then put what you want in each block.

Of course, many

add . If these style settings are similar, it will be too troublesome for us to set each one. We usually put the style in another .css file (controlling the display style of each mark in the web page), and then call it where it needs to be called. Let's try

Create a new notepad, rename it to c.css and then open it and write:

#header{width:200px;height:100px;border-style:solid;}

Copy after login

And delete it in a.html

Then add

.css" />

That is, the file c.css is introduced. The advantage of putting the css into a separate file is that if this style is referenced in many places, we only need to modify this one place, and everything will change. Otherwise, we have to manually modify each place, which is not conducive to later maintenance.

Finally, change the

of a.html to

Related labels：

html

source：php.cn

Previous article：Use regular expression to find html tags with id attribute in html Next article：Front-end interview FAQs

Statement of this Website

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn