Sue Charlesworth, Author at HTML Goodies

Updated by Rob Gravelle Interest in and use of the World Wide Web has been expanding at a phenomenal rate. As the Web grows, so must its vehicle of communication, HTML. The HTML 2.0 specification was published in November of 1995. Since then, the HTML 3.0 draft specification expired on September 28, 1995, without becoming […]

Feb 16, 2016

HTML

New Tags in HTML 4.0

The W3C document "Changes between HTML 3.2 and HTML 4.0" lists eight new tags in HTML 4.0. A brief description of these tags follows. … The … tag acts much the same as the

tag, but applies to shorter quoted sections, ones that don’t need paragraph breaks. Example: According to the W3C, BLOCKQUOTE is […]

Jan 18, 2005

HTML

What’s Different in HTML 4.0

In order to keep up with (or try to) the rapidly changing world of HTML, we present here the changes between HTML 3.2 and HTML 4.0. HTML 4.0 introduces eight new elements, deprecates ten (more about deprecation in a bit), and makes obsolete three more. Frames, formerly only found in the browser versions of HTML, […]

Jan 18, 2005

HTML

Deprecated Tags in HTML 4.0

Deprecated tags and attributes are those that have been replaced by other, newer, HTML constructs. Deprecated tags are still included in the HTML draft or recommendation but are clearly marked as deprecated. Once deprecated, tags may well become obsolete. The draft “strongly urges” the nonuse of deprecated tags. … allowed a form to contain […]

Jan 18, 2005

HTML

Obsolete Tags in HTML 4.0

Obsolete tags have been removed from the HTML specification. While browsers may still support obsolete tags, there is no guarantee that this support will continue. The three tags that become obsolete in HTML 4.0 are

, &lt;PLAINTEXT&gt;, and &lt;LISTING&gt;. In all cases, replace these tags with &lt;PRE&gt;. NOTE: Despite the fact that the HTML 4.0 […]&lt;/p&gt; &lt;/p&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class="gap-x-7 mt-2 uppercase font-mono text-[12px] leading-[16px] tracking-[0.1em] text-zinc-500 flex flex-col"&gt;&lt;div class="text-secondary font-semibold"&gt;&lt;/div&gt;&lt;div class="uppercase font-mono text-[12px] leading-[16px] tracking-[0.1em] text-zinc-500"&gt;Jan 18, 2005&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class="space-y-[17px]"&gt;&lt;div class="flex flex-col w-full"&gt;&lt;a class="block group w-full overflow-hidden relative" href="/html/internationalization/" class="block group w-full overflow-hidden relative"&gt; &lt;div class="relative w-full aspect-video"&gt; &lt;div class="h-full w-full bg-primary/10 flex items-center justify-center aspect-video"&gt;&lt;svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide w-12 h-12 text-primary/40 lucide-image-icon lucide-image w-12 h-12 text-primary/40"&gt;&lt;rect width="18" height="18" x="3" y="3" rx="2" ry="2"&gt;&lt;/rect&gt;&lt;circle cx="9" cy="9" r="2"&gt;&lt;/circle&gt;&lt;path d="m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21"&gt;&lt;/path&gt;&lt;/svg&gt;&lt;/div&gt; &lt;/div&gt; &lt;/a&gt;&lt;a class="bg-primary overflow-hidden text-primary-foreground inline-block uppercase text-[12px] leading-[16px] font-mono font-semibold hover:bg-primary/90 self-start tracking-[0.1em] text-nowrap max-w-full text-ellipsis" href="/html/" class="bg-primary overflow-hidden text-primary-foreground inline-block uppercase text-[12px] leading-[16px] font-mono font-semibold hover:bg-primary/90 self-start tracking-[0.1em] text-nowrap max-w-full text-ellipsis"&gt; &lt;astro-island uid="Z2cklg0" prefix="s5" component-url="https://f3ab25f6.constellation-2bf.pages.dev/_astro/Ticker.cufgKBUd.js" component-export="default" renderer-url="https://f3ab25f6.constellation-2bf.pages.dev/_astro/client.D854Uzx-.js" props="{&amp;quot;text&amp;quot;:[0,&amp;quot;HTML&amp;quot;]}" ssr client="idle" opts="{&amp;quot;name&amp;quot;:&amp;quot;Ticker&amp;quot;,&amp;quot;value&amp;quot;:true}" await-children&gt;&lt;div class="ticker-container px-[8px] py-[6px] flex" style="--scroll-distance:-0px;" data-v-34ac2891&gt;&lt;span class="w-full truncate ticker-text" data-v-34ac2891&gt;HTML&lt;/span&gt;&lt;/div&gt;&lt;!--astro:end--&gt;&lt;/astro-island&gt; &lt;/a&gt;&lt;/div&gt;&lt;a class="font-semibold text-secondary hover:text-primary line-clamp-3 text-ellipsis md:text-[18px]/[22px] text-[18px]/[22px]" href="/html/internationalization/" class="font-semibold text-secondary hover:text-primary line-clamp-3 text-ellipsis md:text-[18px]/[22px] text-[18px]/[22px]"&gt; Internationalization &lt;/a&gt;&lt;div class="md:block hidden"&gt;&lt;div class="font-light text-zinc-800 line-clamp-3 text-ellipsis text-[14px]"&gt;&lt;p&gt;&lt;p&gt;Despite its name, the World Wide Web has had some difficulty reaching out past the Western languages and alphabets. In general, character representation in HTML was largely confined to the use of the ISO 8859-1 (Latin-1) character set. This character set contains letters for English, French, Spanish, German, and the Scandinavian languages, but no Greek, […]&lt;/p&gt; &lt;/p&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class="gap-x-7 mt-2 uppercase font-mono text-[12px] leading-[16px] tracking-[0.1em] text-zinc-500 flex flex-col"&gt;&lt;div class="text-secondary font-semibold"&gt;&lt;/div&gt;&lt;div class="uppercase font-mono text-[12px] leading-[16px] tracking-[0.1em] text-zinc-500"&gt;Jan 18, 2005&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt; &lt;/div&gt; &lt;div class="justify-center md:hidden flex"&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;div class="flex flex-wrap justify-center items-center justify-between mt-14 text-sm text-gray-500"&gt; &lt;div class="flex items-center mt-4 gap-2"&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;script type="module"&gt;(function(){try{var e=typeof window&lt;"u"?window:typeof global&lt;"u"?global:typeof globalThis&lt;"u"?globalThis:typeof self&lt;"u"?self:{};e.SENTRY_RELEASE={id:"57e4468d1b0123b28993130f69f3df2154a4b22e"}}catch{}})();try{(function(){var e=typeof window&lt;"u"?window:typeof global&lt;"u"?global:typeof globalThis&lt;"u"?globalThis:typeof self&lt;"u"?self:{},t=new e.Error().stack;t&amp;&amp;(e._sentryDebugIds=e._sentryDebugIds||{},e._sentryDebugIds[t]="627f917f-af20-4b24-8c49-2ee8ec924ce1",e._sentryDebugIdIdentifier="sentry-dbid-627f917f-af20-4b24-8c49-2ee8ec924ce1")})()}catch{}const d=e=&gt;{document.querySelectorAll("[data-tab-trigger]").forEach(t=&gt;{t.dataset.tabTrigger===e?t.classList.add("tab--active"):t.classList.remove("tab--active")}),document.querySelectorAll("[data-tab]").forEach(t=&gt;{t.style.display=t.dataset.tab===e?"block":"none"})};new URL(window.location.href).hash==="#related-articles"&amp;&amp;d("related-articles");const n=document.querySelector(".tabs");n&amp;&amp;n.querySelectorAll("[data-tab-trigger]").forEach(e=&gt;{e.addEventListener("click",function(t){t.preventDefault();const a=this.dataset.tabTrigger;a&amp;&amp;d(a)})});&lt;/script&gt; &lt;/div&gt; &lt;/div&gt; &lt;aside class="md:flex hidden md:col-span-4 space-y-8"&gt; &lt;div&gt; &lt;div&gt; &lt;div class="flex flex-col gap-7"&gt; &lt;div class="flex items-start justify-between gap-4"&gt; &lt;div class="text-[20px]/[28px] pt-[12px] tracking-[1.4px] font-bold uppercase grow text-secondary border-t-2 border-secondary"&gt; &lt;h2&gt;Latest Articles&lt;/h2&gt; &lt;/div&gt; &lt;div class="hidden md:block"&gt; &lt;/div&gt; &lt;/div&gt; &lt;div&gt; &lt;div class="space-y-5 mb-10"&gt; &lt;div class="flex justify-between border-t border-zinc-200"&gt;&lt;div class="grow h-full space-y-[11px] pr-4"&gt;&lt;a class="text-secondary hover:text-primary my-2 font-semibold line-clamp-3 text-ellipsis overflow-hidden text-[14px]/[18px]" href="/seo/top-online-courses-to-learn-seo/" class="text-secondary hover:text-primary my-2 font-semibold line-clamp-3 text-ellipsis overflow-hidden text-[14px]/[18px]"&gt; Top Online Courses to Learn SEO &lt;/a&gt;&lt;a class="font-mono uppercase font-bold text-xs line-clamp-2 text-ellipsis overflow-hidden tracking-[1px]" href="/seo/" class="font-mono uppercase font-bold text-xs line-clamp-2 text-ellipsis overflow-hidden tracking-[1px]"&gt; SEO &lt;/a&gt;&lt;/div&gt;&lt;a href="/seo/top-online-courses-to-learn-seo/"&gt; &lt;div class="aspect-square relative max-w-[85px] min-w-[85px]"&gt;&lt;div class="h-full group relative" data-lazyimage&gt; &lt;img alt="thumbnail" src="https://assets.htmlgoodies.com/uploads/2021/09/digital-marketing-SEO-tutorial.jpg?w=16" loading="eager" fetchpriority="high" decoding="async" class="object-cover h-full group absolute inset-0" style="z-index: -1"&gt; &lt;div data-blur class="absolute inset-0 transition-[opacity] duration-300" style="backdrop-filter: blur(20px); z-index: 1;"&gt;&lt;/div&gt; &lt;img src="https://assets.htmlgoodies.com/uploads/2021/09/digital-marketing-SEO-tutorial.jpg?w=640" srcset="https://assets.htmlgoodies.com/uploads/2021/09/digital-marketing-SEO-tutorial.jpg?w=128 128w, https://assets.htmlgoodies.com/uploads/2021/09/digital-marketing-SEO-tutorial.jpg?w=256 256w, https://assets.htmlgoodies.com/uploads/2021/09/digital-marketing-SEO-tutorial.jpg?w=512 512w" alt="Top Online Courses to Learn SEO" loading="lazy" fetchpriority="low" decoding="async" data-image="true" style="opacity:0" width="640" height="313" class="object-cover h-full group transition-[opacity] duration-300"&gt; &lt;/div&gt; &lt;/div&gt; &lt;/a&gt;&lt;/div&gt;&lt;div class="flex justify-between border-t border-zinc-200"&gt;&lt;div class="grow h-full space-y-[11px] pr-4"&gt;&lt;a class="text-secondary hover:text-primary my-2 font-semibold line-clamp-3 text-ellipsis overflow-hidden text-[14px]/[18px]" href="/seo/sellzone-review/" class="text-secondary hover:text-primary my-2 font-semibold line-clamp-3 text-ellipsis overflow-hidden text-[14px]/[18px]"&gt; Sellzone Marketing Tool for Amazon Review &lt;/a&gt;&lt;a class="font-mono uppercase font-bold text-xs line-clamp-2 text-ellipsis overflow-hidden tracking-[1px]" href="/seo/" class="font-mono uppercase font-bold text-xs line-clamp-2 text-ellipsis overflow-hidden tracking-[1px]"&gt; SEO &lt;/a&gt;&lt;/div&gt;&lt;a href="/seo/sellzone-review/"&gt; &lt;div class="aspect-square relative max-w-[85px] min-w-[85px]"&gt;&lt;div class="h-full group relative" data-lazyimage&gt; &lt;img alt="thumbnail" src="https://assets.htmlgoodies.com/uploads/2022/08/sellzone-review.png?w=16" loading="eager" fetchpriority="high" decoding="async" class="object-cover h-full group absolute inset-0" style="z-index: -1"&gt; &lt;div data-blur class="absolute inset-0 transition-[opacity] duration-300" style="backdrop-filter: blur(20px); z-index: 1;"&gt;&lt;/div&gt; &lt;img src="https://assets.htmlgoodies.com/uploads/2022/08/sellzone-review.png?w=1024" srcset="https://assets.htmlgoodies.com/uploads/2022/08/sellzone-review.png?w=128 128w, https://assets.htmlgoodies.com/uploads/2022/08/sellzone-review.png?w=256 256w, https://assets.htmlgoodies.com/uploads/2022/08/sellzone-review.png?w=512 512w" alt="Sellzone Marketing Tool for Amazon Review" loading="lazy" fetchpriority="low" decoding="async" data-image="true" style="opacity:0" width="1024" height="630" class="object-cover h-full group transition-[opacity] duration-300"&gt; &lt;/div&gt; &lt;/div&gt; &lt;/a&gt;&lt;/div&gt;&lt;div class="flex justify-between border-t border-zinc-200"&gt;&lt;div class="grow h-full space-y-[11px] pr-4"&gt;&lt;a class="text-secondary hover:text-primary my-2 font-semibold line-clamp-3 text-ellipsis overflow-hidden text-[14px]/[18px]" href="/cms/the-top-database-plugins-for-wordpress/" class="text-secondary hover:text-primary my-2 font-semibold line-clamp-3 text-ellipsis overflow-hidden text-[14px]/[18px]"&gt; The Top Database Plugins for WordPress &lt;/a&gt;&lt;a class="font-mono uppercase font-bold text-xs line-clamp-2 text-ellipsis overflow-hidden tracking-[1px]" href="/cms/" class="font-mono uppercase font-bold text-xs line-clamp-2 text-ellipsis overflow-hidden tracking-[1px]"&gt; CMS &lt;/a&gt;&lt;/div&gt;&lt;a href="/cms/the-top-database-plugins-for-wordpress/"&gt; &lt;div class="aspect-square relative max-w-[85px] min-w-[85px]"&gt;&lt;div class="h-full group relative" data-lazyimage&gt; &lt;img alt="thumbnail" src="https://assets.htmlgoodies.com/uploads/2021/05/wordpress-content-management-system-CMS.png?w=16" loading="eager" fetchpriority="high" decoding="async" class="object-cover h-full group absolute inset-0" style="z-index: -1"&gt; &lt;div data-blur class="absolute inset-0 transition-[opacity] duration-300" style="backdrop-filter: blur(20px); z-index: 1;"&gt;&lt;/div&gt; &lt;img src="https://assets.htmlgoodies.com/uploads/2021/05/wordpress-content-management-system-CMS.png?w=512" srcset="https://assets.htmlgoodies.com/uploads/2021/05/wordpress-content-management-system-CMS.png?w=128 128w, https://assets.htmlgoodies.com/uploads/2021/05/wordpress-content-management-system-CMS.png?w=256 256w, https://assets.htmlgoodies.com/uploads/2021/05/wordpress-content-management-system-CMS.png?w=512 512w" alt="The Top Database Plugins for WordPress" loading="lazy" fetchpriority="low" decoding="async" data-image="true" style="opacity:0" width="512" height="310" class="object-cover h-full group transition-[opacity] duration-300"&gt; &lt;/div&gt; &lt;/div&gt; &lt;/a&gt;&lt;/div&gt; &lt;/div&gt; &lt;div class="flex justify-center md:justify-start right-rail" data-ad-slot="right-rail"&gt; &lt;/div&gt; &lt;style type="text/css"&gt;.right-rail:not([data-loaded]) { min-width: 300px; max-width: 320px; min-height: 50px; max-height: 250px; } @media screen and (min-width: 768px) { .right-rail:not([data-loaded]) { min-width: 160px; max-width: 300px; min-height: 250px; max-height: 600px; } }&lt;/style&gt; &lt;/div&gt; &lt;div class="justify-center md:hidden flex"&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/aside&gt; &lt;/div&gt; &lt;div class="flex items-center justify-center !min-h-[90px] md:!min-h-[130px] inline-bottom" data-ad-slot="inline-bottom"&gt; &lt;/div&gt; &lt;style type="text/css"&gt;.inline-bottom:not([data-loaded]) { min-width: 300px; max-width: 320px; min-height: 50px; max-height: 50px; } @media screen and (min-width: 768px) { .inline-bottom:not([data-loaded]) { min-width: 728px; max-width: 728px; min-height: 90px; max-height: 90px; } } @media screen and (min-width: 1240px) { .inline-bottom:not([data-loaded]) { min-width: 728px; max-width: 1000px; min-height: 90px; max-height: 250px; } }&lt;/style&gt; &lt;/div&gt; &lt;div class="wrapper relative bg-primary text-primary-foreground pt-[44px] pb-[9px] z-999"&gt; &lt;div class="flex flex-col lg:grid lg:grid-cols-5 gap-x-[64px] space-y-[24px] lg:space-y-[16px]"&gt; &lt;div class="space-y-[24px] lg:space-y-[16px] lg:col-span-3"&gt; &lt;a class="inline-block" href="/" class="inline-block"&gt; &lt;div class="max-w-[200px] self-start md:ml-[unset] relative"&gt; &lt;img src="https://f3ab25f6.constellation-2bf.pages.dev/_image/?href=%2F_astro%2Fhtmlgoodies-white.BrUfocbM.png&amp;#38;w=2267&amp;#38;h=408&amp;#38;f=webp" alt="HTML Goodies Logo" data-image="true" style="opacity:1" loading="lazy" decoding="async" fetchpriority="auto" width="2267" height="408" class="max-w-[200px] self-start md:ml-[unset] transition-[opacity] duration-300"&gt; &lt;/div&gt; &lt;/a&gt; &lt;p class="leading-6"&gt; The original home of HTML tutorials. HTMLGoodies is a website dedicated to publishing tutorials that cover every aspect of being a web developer. We cover programming and web development tutorials on languages and technologies such as HTML, JavaScript, and CSS. In addition, our articles cover web frameworks like Angular and React.JS, as well as popular Content Management Systems (CMS) that include WordPress, Drupal, and Joomla. Website development platforms like Shopify, Squarespace, and Wix are also featured. Topics related to solid web design and Internet Marketing also find a home on HTMLGoodies, as we discuss UX/UI Design, Search Engine Optimization (SEO), and web dev best practices. &lt;/p&gt; &lt;div class="flex gap-6 justify-center lg:justify-normal h-fit"&gt; &lt;div class="flex items-center gap-3 gap-4"&gt; &lt;div class="flex items-center"&gt; &lt;a href="https://www.facebook.com/HTMLGoodiesCom" target="_blank" rel="noopener noreferrer" class="flex items-center justify-center w-10 h-10 rounded-full bg-primary-foreground text-primary transition-all ease-in-out hover:opacity-80 aspect-square" aria-label="facebook"&gt; &lt;svg role="img" viewBox="0 0 24 24" class="fill-current" width="20" height="20" aria-hidden="true"&gt;&lt;title&gt;Facebook&lt;/title&gt;&lt;path d="M9.101 23.691v-7.98H6.627v-3.667h2.474v-1.58c0-4.085 1.848-5.978 5.858-5.978.401 0 .955.042 1.468.103a8.68 8.68 0 0 1 1.141.195v3.325a8.623 8.623 0 0 0-.653-.036 26.805 26.805 0 0 0-.733-.009c-.707 0-1.259.096-1.675.309a1.686 1.686 0 0 0-.679.622c-.258.42-.374.995-.374 1.752v1.297h3.919l-.386 2.103-.287 1.564h-3.246v8.245C19.396 23.238 24 18.179 24 12.044c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.628 3.874 10.35 9.101 11.647Z" /&gt;&lt;/svg&gt; &lt;div class="sr-only"&gt;facebook&lt;/div&gt; &lt;/a&gt; &lt;/div&gt;&lt;div class="flex items-center"&gt; &lt;a href="https://www.linkedin.com/company/html-goodies/" target="_blank" rel="noopener noreferrer" class="flex items-center justify-center w-10 h-10 rounded-full bg-primary-foreground text-primary transition-all ease-in-out hover:opacity-80 aspect-square" aria-label="linkedin"&gt; &lt;svg class="fill-current" viewBox="0 0 24 25" fill="none" width="20" height="20" aria-hidden="true"&gt; &lt;path d="M6.20062 21.2143H1.84688V7.194H6.20062V21.2143ZM4.02141 5.2815C2.62922 5.2815 1.5 4.12838 1.5 2.73619C1.5 2.06747 1.76565 1.42614 2.2385 0.953285C2.71136 0.48043 3.35269 0.214783 4.02141 0.214783C4.69012 0.214783 5.33145 0.48043 5.80431 0.953285C6.27716 1.42614 6.54281 2.06747 6.54281 2.73619C6.54281 4.12838 5.413 5.2815 4.02141 5.2815ZM22.4953 21.2143H18.1509V14.3893C18.1509 12.7628 18.1181 10.6768 15.8873 10.6768C13.6237 10.6768 13.2769 12.444 13.2769 14.2721V21.2143H8.92781V7.194H13.1034V9.1065H13.1644C13.7456 8.00494 15.1655 6.84244 17.2838 6.84244C21.69 6.84244 22.5 9.744 22.5 13.5128V21.2143H22.4953Z" fill="currentColor"&gt;&lt;/path&gt; &lt;/svg&gt; &lt;div class="sr-only"&gt;linkedin&lt;/div&gt; &lt;/a&gt; &lt;/div&gt;&lt;div class="flex items-center"&gt; &lt;a href="https://twitter.com/htmlgoodies" target="_blank" rel="noopener noreferrer" class="flex items-center justify-center w-10 h-10 rounded-full bg-primary-foreground text-primary transition-all ease-in-out hover:opacity-80 aspect-square" aria-label="x"&gt; &lt;svg role="img" viewBox="0 0 24 24" class="fill-current" width="20" height="20" aria-hidden="true"&gt;&lt;title&gt;X&lt;/title&gt;&lt;path d="M18.901 1.153h3.68l-8.04 9.19L24 22.846h-7.406l-5.8-7.584-6.638 7.584H.474l8.6-9.83L0 1.154h7.594l5.243 6.932ZM17.61 20.644h2.039L6.486 3.24H4.298Z" /&gt;&lt;/svg&gt; &lt;div class="sr-only"&gt;x&lt;/div&gt; &lt;/a&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;div class="flex gap-x-[64px] lg:col-span-2 justify-center lg:justify-start"&gt; &lt;div class="space-y-[24px] lg:space-y-[16px]"&gt; &lt;h3 class="h3 uppercase font-bold text-[16px]/[16px] text-white"&gt;Company&lt;/h3&gt; &lt;div class="grid space-y-[12px]"&gt; &lt;a class="text-primary-foreground hover:text-primary-foreground/80 text-[16px]/[16px] text-nowrap" href="https://technologyadvice.com/contact-us/" class="text-primary-foreground hover:text-primary-foreground/80 text-[16px]/[16px] text-nowrap" target="_blank" rel="nofollow"&gt; Contact us &lt;/a&gt; &lt;a class="text-primary-foreground hover:text-primary-foreground/80 text-[16px]/[16px] text-nowrap" href="https://solutions.technologyadvice.com/advertise-on-htmlgoodies/?utm_source=htmlgoodies&amp;utm_medium=portfolio_footer&amp;utm_campaign=advertise_contact-us" class="text-primary-foreground hover:text-primary-foreground/80 text-[16px]/[16px] text-nowrap" target="_blank" rel="nofollow"&gt; Advertise with us &lt;/a&gt; &lt;/div&gt; &lt;/div&gt; &lt;div class="space-y-[24px] lg:space-y-[16px]"&gt; &lt;h3 class="h3 uppercase font-bold text-[16px]/[16px] text-white"&gt;Categories&lt;/h3&gt; &lt;div class="grid space-y-[12px]"&gt; &lt;a class="text-primary-foreground hover:text-primary-foreground/80 text-[16px]/[20px] text-ellipsis line-clamp-1" href="/getting-started/" class="text-primary-foreground hover:text-primary-foreground/80 text-[16px]/[20px] text-ellipsis line-clamp-1"&gt; Getting Started &lt;/a&gt;&lt;a class="text-primary-foreground hover:text-primary-foreground/80 text-[16px]/[20px] text-ellipsis line-clamp-1" href="/html/" class="text-primary-foreground hover:text-primary-foreground/80 text-[16px]/[20px] text-ellipsis line-clamp-1"&gt; HTML &lt;/a&gt;&lt;a class="text-primary-foreground hover:text-primary-foreground/80 text-[16px]/[20px] text-ellipsis line-clamp-1" href="/html5/" class="text-primary-foreground hover:text-primary-foreground/80 text-[16px]/[20px] text-ellipsis line-clamp-1"&gt; HTML5 &lt;/a&gt;&lt;a class="text-primary-foreground hover:text-primary-foreground/80 text-[16px]/[20px] text-ellipsis line-clamp-1" href="/css/" class="text-primary-foreground hover:text-primary-foreground/80 text-[16px]/[20px] text-ellipsis line-clamp-1"&gt; CSS &lt;/a&gt;&lt;a class="text-primary-foreground hover:text-primary-foreground/80 text-[16px]/[20px] text-ellipsis line-clamp-1" href="/javascript/" class="text-primary-foreground hover:text-primary-foreground/80 text-[16px]/[20px] text-ellipsis line-clamp-1"&gt; JavaScript &lt;/a&gt;&lt;a class="text-primary-foreground hover:text-primary-foreground/80 text-[16px]/[20px] text-ellipsis line-clamp-1" href="/guides/" class="text-primary-foreground hover:text-primary-foreground/80 text-[16px]/[20px] text-ellipsis line-clamp-1"&gt; Guides &lt;/a&gt;&lt;a class="text-primary-foreground hover:text-primary-foreground/80 text-[16px]/[20px] text-ellipsis line-clamp-1" href="/mobile/" class="text-primary-foreground hover:text-primary-foreground/80 text-[16px]/[20px] text-ellipsis line-clamp-1"&gt; Mobile &lt;/a&gt;&lt;a class="text-primary-foreground hover:text-primary-foreground/80 text-[16px]/[20px] text-ellipsis line-clamp-1" href="/design/" class="text-primary-foreground hover:text-primary-foreground/80 text-[16px]/[20px] text-ellipsis line-clamp-1"&gt; Design &lt;/a&gt;&lt;a class="text-primary-foreground hover:text-primary-foreground/80 text-[16px]/[20px] text-ellipsis line-clamp-1" href="/webmaster/" class="text-primary-foreground hover:text-primary-foreground/80 text-[16px]/[20px] text-ellipsis line-clamp-1"&gt; Webmaster &lt;/a&gt;&lt;a class="text-primary-foreground hover:text-primary-foreground/80 text-[16px]/[20px] text-ellipsis line-clamp-1" href="/video/" class="text-primary-foreground hover:text-primary-foreground/80 text-[16px]/[20px] text-ellipsis line-clamp-1"&gt; Video &lt;/a&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;div class="wrapper relative bg-white pt-[9px] pb-[100px] z-999"&gt; &lt;div class="flex flex-col items-center lg:grid lg:grid-cols-2 gap-x-[64px] space-y-[24px] lg:space-y-[16px]"&gt; &lt;div class="flex flex-col gap-4 col-span-full text-[12px]/[21px] text-secondary"&gt; &lt;div class="space-y-2"&gt; &lt;p class="font-bold"&gt; Property of TechnologyAdvice. &amp;copy; 2025 TechnologyAdvice. All Rights Reserved &lt;/p&gt; &lt;p&gt; Advertiser Disclosure: Some of the products that appear on this site are from companies from which TechnologyAdvice receives compensation. This compensation may impact how and where products appear on this site including, for example, the order in which they appear. TechnologyAdvice does not include all companies or all types of products available in the marketplace. &lt;/p&gt; &lt;/div&gt; &lt;div class="flex gap-4 items-center font-bold uppercase"&gt; &lt;a class="text-secondary hover:text-primary" href="/terms-conditions/" class="text-secondary hover:text-primary"&gt; Terms of Service &lt;/a&gt; &lt;a class="text-secondary hover:text-primary" href="/privacy-policy/" class="text-secondary hover:text-primary"&gt; Privacy Policy &lt;/a&gt; &lt;a class="text-secondary hover:text-primary" href="https://technologyadvice.com/privacy-policy/ccpa-opt-out-form/" class="text-secondary hover:text-primary" target="_blank" rel="nofollow"&gt; California - Do Not Sell My Information &lt;/a&gt; &lt;/div&gt; &lt;div id="choice-footer-msg" class="text-[12px]/[21px]"&gt;&lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt;&lt;astro-island uid="2ljqeU" prefix="s6" component-url="https://f3ab25f6.constellation-2bf.pages.dev/_astro/BackToTop.BlgGo4z-.js" component-export="default" renderer-url="https://f3ab25f6.constellation-2bf.pages.dev/_astro/client.D854Uzx-.js" props="{}" ssr client="load" opts="{&amp;quot;name&amp;quot;:&amp;quot;BackToTop&amp;quot;,&amp;quot;value&amp;quot;:true}" await-children&gt;&lt;svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" id="back-to-top" class="lucide p-1 bg-primary text-primary-foreground fixed bottom-16 md:bottom-32 lg:bottom-4 right-4 z-1001 cursor-pointer transition-all duration-500 ease-in-out rounded hover:shadow-[0px_2px_5px_#000030] hover:scale-110 opacity-0 translate-y-[70px] lucide-chevron-up-icon lucide-chevron-up p-1 bg-primary text-primary-foreground fixed bottom-16 md:bottom-32 lg:bottom-4 right-4 z-1001 cursor-pointer transition-all duration-500 ease-in-out rounded hover:shadow-[0px_2px_5px_#000030] hover:scale-110 opacity-0 translate-y-[70px]" aria-hidden="true"&gt;&lt;path d="m18 15-6-6-6 6"&gt;&lt;/path&gt;&lt;/svg&gt;&lt;!--astro:end--&gt;&lt;/astro-island&gt; &lt;sticky-footer-ad class="group hide-on-empty fixed w-full bottom-0 bg-white flex justify-center items-center border-gray-200 border-t transition-transform duration-500 ease-in-out z-1000 has-data-empty:hidden" style="height: min-content"&gt; &lt;button class="absolute left-8 -top-[25px] cursor-pointer bg-white px-2 border-gray-200 border-t border-r border-l rounded-t-lg" aria-label="Toggle collapse"&gt;&lt;!----&gt;&lt;!--[--&gt; &lt;svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide chevron transition-transform duration-500 lucide-chevron-down-icon lucide-chevron-down chevron transition-transform duration-500" aria-hidden="true"&gt;&lt;path d="m6 9 6 6 6-6"&gt;&lt;/path&gt;&lt;/svg&gt; &lt;!--]--&gt;&lt;/button&gt; &lt;div class="sticky-footer" data-ad-slot="sticky-footer"&gt; &lt;/div&gt; &lt;style type="text/css"&gt;.sticky-footer:not([data-loaded]) { min-width: 300px; max-width: 320px; min-height: 50px; max-height: 50px; } @media screen and (min-width: 768px) { .sticky-footer:not([data-loaded]) { min-width: 728px; max-width: 728px; min-height: 90px; max-height: 90px; } } @media screen and (min-width: 1240px) { .sticky-footer:not([data-loaded]) { min-width: 728px; max-width: 1000px; min-height: 90px; max-height: 90px; } }&lt;/style&gt; &lt;/sticky-footer-ad&gt; &lt;script type="module"&gt;(function(){try{var e=typeof window&lt;"u"?window:typeof global&lt;"u"?global:typeof globalThis&lt;"u"?globalThis:typeof self&lt;"u"?self:{};e.SENTRY_RELEASE={id:"57e4468d1b0123b28993130f69f3df2154a4b22e"}}catch{}})();try{(function(){var e=typeof window&lt;"u"?window:typeof global&lt;"u"?global:typeof globalThis&lt;"u"?globalThis:typeof self&lt;"u"?self:{},t=new e.Error().stack;t&amp;&amp;(e._sentryDebugIds=e._sentryDebugIds||{},e._sentryDebugIds[t]="4119f123-343a-4f11-a814-b0ab0bbbcb96",e._sentryDebugIdIdentifier="sentry-dbid-4119f123-343a-4f11-a814-b0ab0bbbcb96")})()}catch{}class l extends HTMLElement{connectedCallback(){this.querySelector("button")?.addEventListener("click",()=&gt;{const n=this.toggleAttribute("data-collapsed");this.classList.toggle("translate-y-full",n);const o=this.querySelector(".chevron");o&amp;&amp;o.classList.toggle("rotate-180",n)})}}customElements.define("sticky-footer-ad",l);&lt;/script&gt; &lt;/body&gt;&lt;/html&gt;