diff --git a/_posts/2024-11-25-HTML-`time`-Tag.md b/_posts/2024-11-25-HTML-`time`-Tag.md new file mode 100644 index 0000000..78cf944 --- /dev/null +++ b/_posts/2024-11-25-HTML-`time`-Tag.md @@ -0,0 +1,41 @@ +--- +title: HTML `` Tag +toc: false +categories: + - Web Development +tags: + - HTML +date: 2024-11-25 13:22:16 +0800 +last_modified_at: 2024-11-25 13:22:16 +0800 +--- + +HTML `` tag[^1]: + + + +The `` tag defines a specific time (or datetime). + +The `datetime` attribute of this element is used translate the time into a machine-readable format so that browsers can offer to add date reminders through the user's calendar, and search engines can produce smarter search results. + + + +Those available `datetime` formats can be found in documentations[^2][^3]. + +It should be noted that "the `` element does not render as anything special in any of the major browsers"[^4], for example: + +```html +Today is Nov. 25, 2024. +``` + +Today is Nov. 25, 2024. + +We can see there is nothing special, but we can check its difference in developer mode. So I think the `` tag is mainly convenient for web development, e.g. when using CSS and JavaScript, not for formating date strings. + + + +**References** + +[^1]: [HTML `` Tag](https://www.w3schools.com/tags/tag_time.asp). +[^2]: [HTML `` `datetime` Attribute](https://www.w3schools.com/tags/att_time_datetime.asp). +[^3]: [{% raw %}``{% endraw %}: The (Date) Time element](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/time). +[^4]: [W3Schools Tryit Editor](https://www.w3schools.com/tags/tryit.asp?filename=tryhtml5_time). \ No newline at end of file diff --git a/_posts/web development/jekyll/2024-11-25-Date-and-Time-Formats.md b/_posts/web development/jekyll/2024-11-25-Date-and-Time-Formats.md new file mode 100644 index 0000000..c685941 --- /dev/null +++ b/_posts/web development/jekyll/2024-11-25-Date-and-Time-Formats.md @@ -0,0 +1,43 @@ +--- +title: Date and Time Formats in Jekyll +toc: false +categories: + - Web Development +tags: + - Jekyll +date: 2024-11-25 10:00:50 +0800 +last_modified_at: 2024-11-25 13:13:00 +0800 +--- + +**Predefined date filters**[^1][^2] + +- {% raw %}`{{ "2024-11-25 10:00:50 +0800" | date_to_xmlschema }}`{% endraw %}: {{ "2024-11-25 10:00:50 +0800" | date_to_xmlschema }} +- {% raw %}`{{ "2024-11-25 10:00:50 +0800" | date_to_rfc822 }}`{% endraw %}: {{ "2024-11-25 10:00:50 +0800" | date_to_rfc822 }} +- {% raw %}`{{ "2024-11-25 10:00:50 +0800" | date_to_string }}`{% endraw %}: {{ "2024-11-25 10:00:50 +0800" | date_to_string }} +- {% raw %}`{{ "2024-11-25 10:00:50 +0800" | date_to_long_string }}`{% endraw %}: {{ "2024-11-25 10:00:50 +0800" | date_to_long_string }} +- {% raw %}`{{ "2024-11-25 10:00:50 +0800" | date_to_long_string: "ordinal" }}`{% endraw %}: {{ "2024-11-25 10:00:50 +0800" | date_to_long_string : "ordinal" }} + + + +**Combined date filters**[^2] + +- {% raw %}`{{ "2024-11-25 10:00:50 +0800" | date: '%Y-%m-%d' }}`{% endraw %}: {{ "2024-11-25 10:00:50 +0800" | date: '%Y-%m-%d' }} +- {% raw %}`{{ "2024-11-25 10:00:50 +0800" | date: '%m/%d/%Y' }}`{% endraw %}: {{ "2024-11-25 10:00:50 +0800" | date: '%m/%d/%Y' }} +- {% raw %}`{{ "2024-11-25 10:00:50 +0800" | date: '%-m/%-d/%y' }}`{% endraw %}: {{ "2024-11-25 10:00:50 +0800" | date: '%-m/%-d/%y' }} +- {% raw %}`{{ "2024-11-25 10:00:50 +0800" | date: '%B %-d, %Y' }}`{% endraw %}: {{ "2024-11-25 10:00:50 +0800" | date: '%B %-d, %Y' }} +- {% raw %}`{{ "2024-11-25 10:00:50 +0800" | date: '%-d %B %Y' }}`{% endraw %}: {{ "2024-11-25 10:00:50 +0800" | date: '%-d %B %Y' }} +- {% raw %}`{{ "2024-11-25 10:00:50 +0800" | date: '%B %-d, %Y' }}`{% endraw %}: {{ "2024-11-25 10:00:50 +0800" | date: '%B %-d, %Y' }} +- {% raw %}`{{ "2024-11-25 10:00:50 +0800" | date: '%A, %B %-d, %Y' }}`{% endraw %}: {{ "2024-11-25 10:00:50 +0800" | date: '%A, %B %-d, %Y' }} + +If there is no `-` before `d` in date format `'%-d %B %Y'`, numbers below ten would have a leading zero[^3], for example, {% raw %}`{{ "2024-11-07 10:00:50 +0800" | date: '%d %B %Y' }}`{% endraw %}({{ "2024-11-07 10:00:50 +0800" | date: '%d %B %Y' }}) vs. {% raw %}`{{ "2024-10-07 10:00:50 +0800" | date: '%-d %B %Y' }}`{% endraw %} ({{ "2024-10-07 10:00:50 +0800" | date: '%-d %B %Y' }}). +{: .notice--primary} + +There are more formats of year, month, day, hour, minute, second, time zone, weekday, and week number etc. and more date patterns formed by their combination in blog[^2]. + + + +**References** + +[^1]: [Liquid Filters \| Jekyll • Simple, blog-aware, static sites](https://jekyllrb.com/docs/liquid/filters/). +[^2]: [Jekyll Time and Date · Time And Date Formats used for J1 Template](https://jekyll.one/pages/public/tools/toolbox/jekyll/date_time_formats/). +[^3]: [liquid - How does Jekyll date formatting work?](https://stackoverflow.com/questions/7395520/how-does-jekyll-date-formatting-work).