<div class="x78zum5 xdt5ytf"><div class="x9f619 x1n2onr6 x1ja2u2z"><div class="__fb-dark-mode x1n2onr6" role="row" style="--chat-composer-button-color: #ba009c; --chat-composer-input-background-color: var(--comment-background); --chat-edit-message-overlay-color: #61a6ff; --chat-outgoing-message-background-gradient: linear-gradient(#ca34ff, #302cff, #ba009c); --chat-outgoing-message-bubble-background-color: transparent; --mwp-header-button-color: #ca34ff; --mwp-message-list-actions-gap: 0px; --mwp-message-list-actions-width: calc(84px + 3*0px); --mwp-message-row-background: var(--messenger-card-background); --mwp-primary-theme-color: #601ddd; --reaction-pill-multireact-selected-color: #dccdf8; --mwp-reply-background-color: var(--comment-footer-background); --mwp-message-list-profile-start-padding: 16px;"><div class=""><div class="x78zum5 xdt5ytf x1n2onr6" data-release-focus-from="CLICK" data-scope="messages_table" role="gridcell" tabindex="0"><div role="presentation" class="html-div xe8uvvx xdj266r x11i5rnm xat24cr x1mh8g0r xexx8yu x4uap5 x18d9i69 xkhd6sd x1h91t0o xkh2ocl x78zum5 xdt5ytf x13a6bvl x193iq5w x1iyjqo2 x1eb86dx"><div class="x9f619 x1n2onr6 x1ja2u2z x78zum5 x2lah0s x1qughib x1qjc9v5 xozqiw3 x15zctf7"><div class="x9f619 x1n2onr6 x1ja2u2z x78zum5 xdt5ytf x2lah0s x193iq5w xeuugli"><h4 dir="auto" class="html-h4 xe8uvvx xdj266r x11i5rnm xat24cr x1mh8g0r xexx8yu x4uap5 x18d9i69 xkhd6sd x1vvkbs x1heor9g x1qlqyl8 x1pd3egz x1a2a7pz"><div role="presentation" class="html-div xe8uvvx xdj266r x11i5rnm xat24cr x1mh8g0r xexx8yu x18d9i69 x1h91t0o xkh2ocl x78zum5 xdt5ytf x13a6bvl x193iq5w x1c4vz4f x1eb86dx xe53cfu xrgni87"><div class="html-div xe8uvvx x11i5rnm xat24cr x1mh8g0r xexx8yu x4uap5 x78zum5 x1anpbxc x10b6aqq x1ye3gou x13a6bvl"><span class="x193iq5w xeuugli x13faqbe x1vvkbs x1xmvt09 x1lliihq x1s928wv xhkezso x1gmr53x x1cpjm7i x1fgarty x1943h6x x4zkp8e x676frb x1pg5gke xvq8zen xo1l8bm xi81zsa" dir="auto"><span class="html-span xdj266r x11i5rnm xat24cr x1mh8g0r xexx8yu x4uap5 x18d9i69 xkhd6sd x1hl2dhg x16tdsg8 x1vvkbs x186z157"><span aria-label="Đã chỉnh sửa" class="html-span xdj266r x11i5rnm xat24cr x1mh8g0r xexx8yu x4uap5 x18d9i69 xkhd6sd x1hl2dhg x16tdsg8 x1vvkbs">Đã chỉnh sửa</span></span></span></div></div></h4></div></div></div><div role="presentation" class="html-div xe8uvvx xdj266r x11i5rnm xat24cr x1mh8g0r xexx8yu x4uap5 x18d9i69 xkhd6sd x1eb86dx xh8yej3 x1jwls1v" style="--height: 2px;"></div><div class="x78zum5" role="none"><div role="presentation" class="html-div xe8uvvx xdj266r x11i5rnm xat24cr x1mh8g0r xexx8yu x18d9i69 x1h91t0o xkh2ocl x78zum5 xdt5ytf x13a6bvl x193iq5w x1c4vz4f x1eb86dx x1sxyh0 x1nvil2r"></div><div class="x78zum5 x1iyjqo2 xs83m0k xeuugli x15zctf7" role="none"><div role="presentation" class="html-div xe8uvvx xdj266r x11i5rnm xat24cr x1mh8g0r xexx8yu x4uap5 x18d9i69 xkhd6sd x1h91t0o xkh2ocl x78zum5 xdt5ytf x13a6bvl x193iq5w xeuugli"><div role="presentation" class="html-div xe8uvvx xdj266r x11i5rnm xat24cr x1mh8g0r xexx8yu x4uap5 x18d9i69 xkhd6sd x78zum5 xh8yej3"><div role="presentation" class="html-div xe8uvvx xdj266r x11i5rnm xat24cr x1mh8g0r xexx8yu x4uap5 x18d9i69 xkhd6sd x1h91t0o xkh2ocl x78zum5 xdt5ytf x13a6bvl x193iq5w x1iyjqo2 x1eb86dx"><div role="presentation" class="html-div xe8uvvx xdj266r x11i5rnm xat24cr x1mh8g0r xexx8yu x4uap5 x18d9i69 xkhd6sd x1r8uery x1iyjqo2"></div></div><div class="x78zum5 xdt5ytf x193iq5w x1n2onr6 x1kxipp6 xuk3077"><span class="x4k7w5x x1h91t0o x1h9r5lt x1jfb8zj xv2umb2 x1beo9mf xaigb6o x12ejxvf x3igimt xarpa2k xedcshv x1lytzrv x1t2pt76 x7ja8zs x1qrby5j"><div class="x78zum5 xh8yej3" role="none"><div role="presentation" class="html-div xe8uvvx xdj266r x11i5rnm xat24cr x1mh8g0r xexx8yu x4uap5 x18d9i69 xkhd6sd x1h91t0o xkh2ocl x78zum5 xdt5ytf x13a6bvl x193iq5w x1iyjqo2 x1eb86dx"><div role="presentation" class="html-div xe8uvvx xdj266r x11i5rnm xat24cr x1mh8g0r xexx8yu x4uap5 x18d9i69 xkhd6sd x1r8uery x1iyjqo2"></div></div><div class="html-div xe8uvvx xdj266r x11i5rnm xat24cr x1mh8g0r xexx8yu x4uap5 x18d9i69 xkhd6sd x6ikm8r x10wlt62"><div role="presentation" class="html-div xe8uvvx xdj266r x11i5rnm xat24cr x1mh8g0r x14ctfv x1okitfd x1k4qllp x6ikm8r x10wlt62 x1y1aw1k xwib8y2 x1ye3gou xn6708d x1n2onr6 x1vjfegm x1mzt3pk x13faqbe x11jlvup xpmdkuv x154zaqr x12z03op xyhp3ou x13fuv20 xu3j5b3 x1q0q8m5 x26u7qi x12lizq0 xf766zg x1ybe9c6 x1ts5dru x1tlxs6b x1g8br2z x1gn5b1j x230xth"><span class="x193iq5w xeuugli x13faqbe x1vvkbs x1xmvt09 x1lliihq x1s928wv xhkezso x1gmr53x x1cpjm7i x1fgarty x1943h6x xudqn12 x3x7a5m x6prxxf xvq8zen xo1l8bm x14ctfv" dir="auto"><div dir="auto" class="html-div xe8uvvx xexx8yu x4uap5 x18d9i69 xkhd6sd x1gslohp x11i5rnm x12nagc x1mh8g0r x1yc453h x126k92a xyk4ms5">chó Danh</div></span></div></div></div></span></div></div><div role="presentation" class="html-div xe8uvvx xdj266r x11i5rnm xat24cr x1mh8g0r xexx8yu x4uap5 x18d9i69 xkhd6sd x1h91t0o xkh2ocl x78zum5 xdt5ytf x13a6bvl x193iq5w x1c4vz4f x1eb86dx"></div></div><div role="presentation" class="html-div xe8uvvx xdj266r x11i5rnm xat24cr x1mh8g0r xexx8yu x4uap5 x18d9i69 xkhd6sd x1h91t0o xkh2ocl x78zum5 xdt5ytf x13a6bvl x193iq5w x1c4vz4f x1eb86dx"><div aria-hidden="true" class="html-div xe8uvvx xdj266r x11i5rnm xat24cr x1mh8g0r xexx8yu x18d9i69 xkhd6sd x78zum5 xdt5ytf x1iyjqo2 x2lah0s xl56j7k x1n2onr6 x1mqs8db x1n327nk x1mpkggp"><div role="presentation" class="html-div xe8uvvx xdj266r x11i5rnm xat24cr x1mh8g0r xexx8yu x4uap5 x18d9i69 xkhd6sd x6s0dn4 x78zum5 x1mqs8db xl5lk40 x15zctf7"></div></div></div><div role="presentation" class="html-div xe8uvvx xdj266r x11i5rnm xat24cr x1mh8g0r xexx8yu x4uap5 x18d9i69 xkhd6sd x1h91t0o xkh2ocl x78zum5 xdt5ytf x13a6bvl x193iq5w x1iyjqo2 x1eb86dx"><div role="presentation" class="html-div xe8uvvx xdj266r x11i5rnm xat24cr x1mh8g0r xexx8yu x4uap5 x18d9i69 xkhd6sd x1r8uery x1iyjqo2"></div></div></div><div role="presentation" class="html-div xe8uvvx xdj266r x11i5rnm xat24cr x1mh8g0r xexx8yu x4uap5 x18d9i69 xkhd6sd x1h91t0o xkh2ocl x78zum5 xdt5ytf x13a6bvl x193iq5w x1c4vz4f x1eb86dx"><div class="x1xc55vz" role="none"></div></div></div><div role="presentation" class="html-div xe8uvvx xdj266r x11i5rnm xat24cr x1mh8g0r xexx8yu x4uap5 x18d9i69 xkhd6sd x1eb86dx xh8yej3 x1jwls1v" style="--height: 6px;"></div><div class="html-div xe8uvvx xdj266r x11i5rnm xat24cr x1mh8g0r xexx8yu x4uap5 x18d9i69 xkhd6sd x1eb86dx x78zum5 x13a6bvl"></div></div></div><div role="gridcell"><div aria-label="Chi tiết và hành động" class="x1i10hfl x1qjc9v5 xjqpnuy xa49m3k xqeqjp1 x2hbi6w x13fuv20 xu3j5b3 x1q0q8m5 x26u7qi x972fbf xcfux6l x1qhh985 xm0m39n x9f619 x1ypdohk xdl72j9 x2lah0s xe8uvvx xdj266r x11i5rnm xat24cr x1mh8g0r x2lwn1j xeuugli x16tdsg8 x1hl2dhg xggy1nq x1t137rt x3nfvp2 x1q0g3np x87ps6o x1lku1pv x1a2a7pz __fb-light-mode  x1h0vfkc x1lq5wgf xgqcy7u x30kzoy x9jhf4c x152obne xlr8s2x xz9dl7a xn6708d xsag5q8 x1ye3gou x1qiirwl x105ttfm x1vjfegm xzpqnlu x1hyvwdk xjm9jq1 x6ikm8r x10wlt62 x10l6tqk x1i1rx1s" role="button" tabindex="-1"><div class="x1qjc9v5 x9f619 xdl72j9 x2lwn1j xeuugli x1n2onr6 x1ja2u2z x78zum5 xdt5ytf xs83m0k xz62fqu x16ldp7u"><div class="x1qjc9v5 x9f619 x78zum5 xdl72j9 xdt5ytf x2lah0s x2lwn1j xeuugli x1n2onr6 x1ja2u2z xu06os2 x1ok221b"><span class="x1lliihq x1plvlek xryxfnj x1n2onr6 x193iq5w xeuugli x13faqbe x1vvkbs x1s928wv xhkezso x1gmr53x x1cpjm7i x1fgarty x1943h6x x1xmvt09 x1nxh6w3 x1fcty0u xzsf02u x1yc453h x4zkp8e x676frb xq9mrsl" dir="auto" style="line-height: var(--base-line-clamp-line-height); --base-line-clamp-line-height: 16px;">Enter</span></div></div><div class="x1ey2m1c xds687c x17qophe xg01cxk x47corl x10l6tqk x13vifvy x1ebt8du x19991ni x1dhq9h x1o1ewxj x3x9cwd x1e5q0jg x13rtm0m" role="none" data-visualcompletion="ignore"></div></div></div></div></div></div>

HTML Online Editor & Compiler

Write, Run & Share HTML code online using OneCompiler's HTML online Code editor for free. It's one of the robust, feature-rich online Code editor for HTML language, running on the latest version HTML5. Getting started with the OneCompiler's HTML compiler is simple and pretty fast. The editor shows sample boilerplate code when you choose language as HTML. You can also specify the stylesheet information in styles.css tab and scripts information in scripts.js tab and start coding.

About HTML

HTML(Hyper Text Markup language) is the standard markup language for Web pages, was created by Berners-Lee in the year 1991. Almost every web page over internet might be using HTML.

Syntax help

Fundamentals

  • Any HTML document must start with document declaration <!DOCTYPE html>
  • HTML documents begin with <html> and ends with </html>
  • Headings are defined with <h1> to <h6> where <h1> is the highest important heading and <h6> is the least important sub-heading.
  • Paragrahs are defined in <p>..</p> tag.
  • Links are defined in <a> tag.

    Example:

    <a href="https://onecompiler.com/html">HTML online compiler</a>
  • Images are defined in <img> tag, where src attribute consists of image name.
  • Buttons are defined in <button>..</button> tag
  • Lists are defined in <ul> for unordered/bullet list and <ol> for ordered/number list, and the list items are defined in <li>.

HTML Elements and Attributes

  • HTML element is everything present from start tag to end tag.
  • The text present between start and end tag is called HTML element content.
  • Anything can be a tagname but it's preferred to put the meaningful title to the content present as tag name.
  • Do not forget the end tag.
  • Elements with no content are called empty elements.
  • Elements can have attributes which provides additional information about the element.
  • In the below example, href is an attribute and a is the tag name.

    Example:

    <a href="https://onecompiler.com/html">HTML online compiler</a>

CSS

CSS(cascading style sheets) describes how HTML elements will look on the web page like color, font-style, font-size, background color etc.

Example:

Below is a sample style sheet which displays heading in green and in Candara font with padding space of 25px.

body{
  padding: 25px;
}
.title {
	color: #228B22;
	font-family: Candara;
}

HTML Tables

  • HTML Tables are defined in <table> tag.
  • Table row should be defined in <tr> tag
  • Table header should be defined in <th> tag
  • Table data should be defined in <td> tag
  • Table caption should be defined in <caption> tag

HTML-Javascript

  • Javascript is used in HTML pages to make them more interactive.
  • <script> is the tag used to write scripts in HTML
  • You can either reference a external script or write script code in this tag.

Example

<script src="script.js"></script>