time nested within elements, elements nested within time
Classified as: flow content, phrasing content, palpable content
Parents, time
Children, time
Examples: time parents, time children
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 | <!doctype html> <> <> <>...</> </> <> <> <> ... </> </> <>...</> </> </> |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | <!doctype html> <> <> <>...</> </> <> <> < datetime="2013-08"> <> ... </> </> </> </> </> |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 | <!doctype html> <> <> <>...</> <>...</> </> <> <> <> ... </> <> ... </> </> </> </> |
Syntax 1: Valid, time nested within p, body: allowed
Syntax 2: Valid, em nested within time: allowed, because the datetime attribute is present on time
Syntax 3: Invalid, time nested within time, head: not allowed; article nested within time: not allowed
Video demonstration nesting time element
HTML5 nesting time Tutorial
min | video details |
---|---|
00:00 | video tutorial: nesting time |
00:05 | - if datetime attribute is present on time element, elements classified as phrasing content can be nested inside it - if datetime attribute is absent on time element, only content valid time-datetime format can be added inside |
00:17 | A) datetime attribute absent datetime attribute is absent on all these time elements → the content inside it represents valid time-datetime format |
00:24 | e.g. 2014 represents valid time-datetime format (YYYY) for year |
00:30 | 19:30 represents valid time-datetime format (hh:mm) for time and so forth |
00:51 | B) datetime attribute present datetime attribute is present on time element → elements classified as phrasing content can be nested inside it e.g. b element |
01:09 | example of invalid syntax: phrasing content (b element) nested inside time element when datetime attribute is missing |