2

There may be any random structure for html markup:

<div id="five">
  <main>test</main>
  <p>test</p>
  <div>test</div>
  <ul><li>test</li></ul>
  <article>test</article>
</div>

Now, how can I select only html5 elements?

I want to style all html5 elements descendent of id="five" only like padding: 0; font-size: 1.5em; etc. but other elements should contain it's own css.

I could write all html5 elements with comma separated tag but it would be so long method.

So, is there any way (single selector or selctor once) for selecting html5 elements only with css or jQuery?

In jQuery How can I select the html5 elements only?

if($(this).prop('tagName') == html5) alert('you need latest browser to run');
Bhojendra Rauniyar
  • 83,432
  • 35
  • 168
  • 231
  • 6
    Use a common class for each HTML5 tag. and select it using JQUERY. – Manish Kumar Feb 19 '14 at 06:57
  • 1
    heres a list of all elements added in html5 https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/HTML5/HTML5_element_list you will have to select each one e.g. `'article, section, ...'` – actual_kangaroo Feb 19 '14 at 06:58
  • you seem to be attempting to use html5 elements on older broswer? if so, try a html5 reset http://stackoverflow.com/questions/3485720/which-html5-reset-css-do-you-use-and-why – actual_kangaroo Feb 19 '14 at 07:08
  • If you have more html5 elements then attach class to other ,or create array of othe html elements except html5..may be it is short !! – ashbuilds Feb 19 '14 at 07:21
  • 1
    All elements are part of HTML 5. Maybe you mean *elements which are new in HTML 5 compared to HTML 4*? – deceze Feb 19 '14 at 07:22

2 Answers2

0

I would create a style sheet with the following inheritance:

 .html5 > article,
 .html5 > aside {
    display: block;
  }

and add all the relevant html tags based on reference and either use jquery to add a class or directly style these specific html5 elements.

xivo
  • 2,054
  • 3
  • 22
  • 37
0

Use a separate class like Manish suggested See Below Example

<div id="five">
  <main class="html5">test</main>
  <p>test</p>
  <div>test</div>
  <ul><li>test</li></ul>
  <article class="html5">test</article>
</div>

And Apply css to that Class in #five

#five .html5 {
  /*Add your css for html five element here*/

}
Community
  • 1
  • 1
GajendraSinghParihar
  • 9,051
  • 11
  • 36
  • 64