How to use html table (to show the visual effect of web page)

How to use html table (to show the visual effect of web page)

We know that when using HTML on NetEase Blog, we can add the code directly to the template, but the effect is not very good. That's because the codes are not arranged well. Now I'll talk about using tables to arrange them, which can display the special effects well.

In HTML syntax, table is an indispensable part. Without it, it is difficult to display the visual effect of the web page. Now I will talk about table. The following is a table with two rows and two columns:

The code is: <TABLE style="BORDER-RIGHT: 1px solid; BORDER-TOP: 1px solid; BORDER-LEFT: 1px solid; BORDER-BOTTOM: 1px solid" cellSpacing=1 cellPadding=1 width="100%" border=1>
<TBODY>
<TR>
<TD>&nbsp;</TD>
<TD>&nbsp;</TD></TR>
<TR>
<TD>&nbsp;</TD>
<TD>&nbsp;</TD></TR></TBODY></TABLE>

tr represents rows, td represents columns, border represents thickness ("0" means it will not be displayed), and &nbsp; represents spaces. Here, the width of the table is best to be 100% (width="100%"). Do you understand now? Once you understand it, you can add the code you want in "<TD>&nbsp;</TD>".

For example: <TABLE style="BORDER-RIGHT: 1px solid; BORDER-TOP: 1px solid; BORDER-LEFT: 1px solid; BORDER-BOTTOM: 1px solid" cellSpacing=1 cellPadding=1 width="100%" border=1>
<TBODY>
<TR>
<td><marquee>Welcome to ω.⑨s. Messenger's Home</marquee></td>
<TD>&nbsp;</TD></TR>
<TR>
<TD>&nbsp;</TD>
<TD>&nbsp;</TD></TR></TBODY></TABLE>

The effect is:

Welcome to ω.⑨s. Messenger Home

Just like this, the rest is the same.

One more thing: when we make tables, some of them look like this:

and

The approach is:

<table border="1" width="100%">
<tr>
<td colspan="2">&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</table>

and
<table border="1" width="100%">
<tr>
<td rowspan="2">&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
</table>

If you look closely, you will see that there are extra colspan="2" and rowspan="2", right? ! ! !

This is what you want. "2" is a parameter, which you also need to set yourself.

<table border="1" width="100%">
<tr>
<td colspan="2"><marquee>Welcome to ω.⑨s. Messenger's Home</marquee></td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</table>

and
<table border="1" width="100%">
<tr>
<td rowspan="2"><marquee>Welcome to ω.⑨s. Messenger's Home</marquee></td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
</table>

The effects are:

Welcome to ω.⑨s. Messenger Home

and

Welcome to ω.⑨s. Messenger Home

Note: Other codes must be added in <td>....</td>. This is for those friends who don’t understand HTML! !

<<:  Full process record of Nginx reverse proxy configuration

>>:  Examples of vertical grid and progressive line spacing

Recommend

MySQL simple example of sorting Chinese characters by pinyin

If the field storing the name uses the GBK charac...

Three examples of blur background effects using CSS3

Let’s not start with the introduction and get str...

Mysql solution to improve the efficiency of copying large data tables

Preface This article mainly introduces the releva...

Detailed explanation of MySQL index selection and optimization

Table of contents Index Model B+Tree Index select...

A brief analysis of MySQL cardinality statistics

1. What is the cardinality? Cardinality refers to...

Detailed explanation of MySQL group sorting to find the top N

MySQL group sorting to find the top N Table Struc...

Detailed explanation of the 14 common HTTP status codes returned by the server

HTTP Status Codes The status code is composed of ...

MySQL single table query example detailed explanation

1. Prepare data The following operations will be ...

Detailed explanation of jQuery's core functions and event handling

Table of contents event Page Loading Event Delega...

Essential conditional query statements for MySQL database

Table of contents 1. Basic grammar 2. Filter by c...

Why should MySQL fields use NOT NULL?

I recently joined a new company and found some mi...

An example of installing MySQL on Linux and configuring external network access

Configuration steps 1. Check whether DNS is confi...

A brief discussion on the problem of forgotten mysql password and login error

If you forget your MySQL login password, the solu...