Home > Web Front-end > Front-end Q&A > How to set tr in css

How to set tr in css

PHPz
Release: 2023-04-13 10:33:07
Original
1581 people have browsed it

CSS Settings <tr> Elements

In HTML tables, the <tr> elements define table rows. CSS can be used to set the style of <tr> elements, such as background color, border, alignment, etc.

  1. Set the background color

Use the background-color attribute to set the background color of the <tr> element. Here's an example:

tr {
  background-color: yellow;
}
Copy after login

This will make the background color of all <tr> elements yellow.

  1. Set the border

Use the border attribute to set the border of the <tr> element. Here's an example:

tr {
  border: 1px solid black;
}
Copy after login

This will add a solid black border of 1 pixel thickness to all <tr> elements.

  1. Set alignment

Use the text-align attribute to set the horizontal alignment of the <tr> element. Here's an example:

tr {
  text-align: center;
}
Copy after login

This will center align the content of all <tr> elements horizontally.

Use the vertical-align attribute to set the vertical alignment of the <tr> element. Here's an example:

tr {
  vertical-align: middle;
}
Copy after login

This will center-align the content of all <tr> elements vertically.

  1. Set font style and color

Use the color attribute to set the font color of the <tr> element. Here's an example:

tr {
  color: blue;
}
Copy after login

This will make the text in all <tr> elements blue.

Use the font-family and font-size attributes to set the font and size of the text in the <tr> element. Here's an example:

tr {
  font-family: Arial;
  font-size: 14px;
}
Copy after login

This will make the text in all <tr> elements have a font of Arial and a font size of 14px.

  1. Set other styles

Using CSS, you can also set other styles of <tr> elements, such as height, line spacing, etc. Here are some examples:

tr {
  height: 50px; /* 设置行高为 50 像素 */
  line-height: 50px; /* 设置行距为 50 像素 */
  padding: 10px;  /* 设置内边距为 10 像素 */
}
Copy after login

The above are some common styles for CSS settings <tr> elements. In actual applications, you can set each <tr> element individually as needed or add a class name to all <tr> elements and set the style together.

The above is the detailed content of How to set tr in css. For more information, please follow other related articles on the PHP Chinese website!

source:php.cn
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
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template