Is it possible to create a class within a list?

Asked

Viewed 60 times

0

I am mounting a list that has an image and its size in the same line according to the code below.

<tr>
    <th>
       <img src="images/radio1.jpg" width="48px" , height="48px" />
    </th>
    <th>Tradição AM</th>
    <th>11.750.246/0001-05</th>
</tr>

I want to create a class within a <th> to set the width and heigth by my css sheet to facilitate the work. Is this possible? If not, how else can I achieve a similar result?

  • Yes you can create a class and then edit the sizes, colors etc in your CSS

  • but where? inside th? at the beginning of tbody? tr?

2 answers

0

Follow an example below.

In your.html file put like this, remembering that it is not recommended to use the style within html, but rather direct by css.

<style>
 .classth1{width:50%};
 .classth2{color:green};
 .classth3{color:blue};
<style>

<tr>
  <th class="classth1">
    <img src="images/radio1.jpg" width="48px" , height="48px" />
  </th>
  <th class="classth2">Tradição AM</th>
  <th class="classth3">11.750.246/0001-05</th>
</tr>

0


Your HTML syntax is wrong:

                            essa vírgula não deveria existir
                                          ↓
<img src="images/radio1.jpg" width="48px" , height="48px" />
                                      ↑               ↑
                      esses valores devem ser numéricos, e não aceitam px

The right thing would be:

<img src="images/radio1.jpg" width="48" height="48" />

If you want to set the image dimensions via CSS, change the element to:

<img src="images/radio1.jpg" />

And put in your CSS:

th img{ /* seleciona img dentro do th */
   width: 48px;
   height: 48px
}

You can add a class to th also:

<tr>
    <th class="lista">
       <img src="images/radio1.jpg" width="48px" , height="48px" />
    </th>
    <th>Tradição AM</th>
    <th>11.750.246/0001-05</th>
</tr>

There changes the selector too:

th.lista img{ /* seleciona img dentro do th */
   width: 48px;
   height: 48px
}

Example:

th.lista img{
   width: 48px;
   height: 48px
}
<table>
<tr>
    <th class="lista">
       <img src="https://www.cleverfiles.com/howto/wp-content/uploads/2016/08/mini.jpg" />
    </th>
    <th>Tradição AM</th>
    <th>11.750.246/0001-05</th>
</tr>
</table>

  • but in that case, whenever there is an image inside a th she will stay at that size right? how could I create a class within that list? vc can add that to your reply?

  • Sorry for the delay. I updated the answer. See if that was it. Abs!

Browser other questions tagged

You are not signed in. Login or sign up in order to post.