element inside td tag

Question

<table>
    <tr>
        <td>Hello StackOverFlow</td>
    </tr>
</table>

Hi! I am new to html, can someone tell me what type of element is the word 'Hello StackOverFlow' inside the td tag? Is it a label?

What he said. However, if you're referring to the `` then that is a *table data* (I usually refer to it as a *cell*) . — Adam Kewley, Apr 21 '15 at 07:33
So how should I address it for styling? table tr td textnode? — Ethyl Casin, Apr 21 '15 at 07:34
For styling with CSS: `td { background-color: #000; }`, unless you need something more specific — Adam Kewley, Apr 21 '15 at 07:34
If you want to change the textnode *within* a `td` then all the manipulations are done with the parent `td`. For example: `td { font-size: 2 em; }` — Adam Kewley, Apr 21 '15 at 07:36
I don't understand why people are using css when css tag has not even been added to the question. You simply need to check for it's **nodeType** . — kemicofa ghost, Apr 21 '15 at 08:00

score 3 · Accepted Answer · edited May 23 '17 at 12:06

The element inside the <td> tag is a text node. You can't address it in CSS. If you want to style it, you either have to style the <td> tag or surround the text you want to style with a <span> element.

So to, e.g., style only the Hello:

<table>
    <tr>
        <td><span>Hello<span> StackOverFlow</td>
    </tr>
</table>

And in your CSS

span { font-weight: bold; }

Or whatever style you want to give it.

See also the answer to this related question.

kemicofa ghost · Answer 2 · 2015-04-21T07:50:30.193

3

Want to check the type of Hello Stackoverflow? Simpy check the td's content's nodeType

//Gave your td an id of 'td'
alert($('#td').contents().get(0).nodeType);

This will return 3. A nodeType of 3 means it is a text.

Here is an image of each nodeType:

w3schools image on nodeType

w3schools on nodeType

edited Apr 21 '15 at 07:50

answered Apr 21 '15 at 07:42

kemicofa ghost

16,349
8
82
131

element inside td tag

2 Answers2