Home > Developer > Web Develop
Here's a very common label: <div></div> div is the abbreviation for Divison (bounds). <div> allows you to divide the page into different accommodating blocks, such as the following code:
<!DOCTYPE HTML><HTML> <Head> <title>Division</title> </Head> <Body> <Divstyle= "width:50px; height:50px; background-color:red"></Div> <Divstyle= "width:50px; height:50px; Background-color:blue"></Div> <Divstyle= "width:50px; height:50px; Background-color:green"></Div> </Body></HTML>
Generates three lengths and widths of 50 pixels, with a background color of three blocks of red, blue, and green, which are simply represented as follows:
| Red |
| Blue |
| Green |
We can add links to these blocks.
Two. <span><div> allows us to split the page into different pieces of style, <span> allows us to empty a Web page within a small range of styles, such as text. If you want a word in a paragraph to turn red, we can do this:
< body < p < span style = "color:red" </ span ></ p </ body
This way "Red" will show red.
Three. Another use of the table---photo wallWe already know everything about the table, here is a more useful thing to do with a closed table formatted text---formatted picture.
1. The first step is to create a m*n table with 1*3 as an example
2. The second step is to write a link to the image in each <tb></td>, i.e.
3. Select to add a link to the image.
Here is an example:
<!DOCTYPE HTML><HTML> <Head> <Linktype= "Text/css"rel= "stylesheet"href= "Stylesheet.css" /> <title>My Photo Page</title> </Head> <Body> <Table> <thead> <th>Phototable</th> </thead> <TR> <TD> <ahref= "Http://www.qq.com"> <imgsrc= "Https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcQOaHlmg3BSaQWCeooH8MiWTLt-asuuY3GC14ZWJ2L3soLLfy_JOQ" /> </a> </TD> <TD> <ahref= "Http://www.qq.com"> <imgsrc= "Https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcQOaHlmg3BSaQWCeooH8MiWTLt-asuuY3GC14ZWJ2L3soLLfy_JOQ" /> </a> </TD>
<TD>
<ahref= "Http://www.qq.com">
<imgsrc= "Https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcQOaHlmg3BSaQWCeooH8MiWTLt-asuuY3GC14ZWJ2L3soLLfy_JOQ" />
</a>
</TD> </TR> </Table> </Body></HTML>
The effect is this:
PS: This photo wall is 3*3, there is only one picture selected, and the link of each picture is www.qq.com.
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
