Good morning, does anyone know what the name of this bar is (red bar on the page below), or the effect name applied to it?
Good morning, does anyone know what the name of this bar is (red bar on the page below), or the effect name applied to it?
This bar was made with a <table>
. In fact if you give a Ctrl+U
on this page you will see that it was all done with a table, which is a very outdated technique to assemble layouts and nothing responsive!
Hereisthebarcode:
.produtos-relacao {
font-family: Calibri;
font-size: 18px;
color: #FFFFFF;
font-weight: bold;
background-color: #EC3237;
text-align: center;
border: 1px solid #6A6F75;
margin: 5px;
padding: 5px;
}
<table width="100%" border="0" cellpadding="0" cellspacing="0" class="produtos-relacao">
<tbody>
<tr>
<td width="20%"><a href="produtos_lojas.htm">@Lojas</a></td>
<td width="20%"><a href="produtos_hotel.htm">@Hotel</a></td>
<td width="20%"><a href="produtos_nfe.htm">@NFe</a></td>
<td width="20%"><a href="produtos_sped.htm">@SPED</a></td>
</tr>
</tbody>
</table>
TIP:
Do not use table to make layouts, tables are for tabular data. To make layouts use semantic tags like main
, nav
, section
etc ...
Start by studying for these links, they will help you better understand the basics! link and here tb link After studying them you can look for other Bootstrap and Materialize Design Sistems frameworks.