<!DOCTYPE html> :defines the HTML page
<!–….–> : this is the comment tag
<form> : defines an HTML form for user input
<div> : defines a section in a document.
<head> : contains metadata & information for the document.
<html> defines the root of an HTML document.
<meta> : defines metadata about an html document.
<b> : defines a bold text.
<body> : contains the mean visible codes of a document.
<button> : defines clickable buttons.
<em> : defines emphasized text.
<h1> to <h6> : defines html heading.
<input> : defines an input control.
<label> : defines a label for an <input> element.
<title> : defines a title for the document.
<script> : defines JavaScript codes.
<style> : defines css styling.
- Programming
- Alert with inline scripting<DOCTYPE html> <html> <head> <title>alart</title> </head> <body> <p>we will give an alert with button using inline scripting.</p> <h3>click button to alert</h3> <button onclick=”alert(‘I love Code-xombi, what about u?’)”>Click</button> </body> </html>More
- Creating an alert button<!DOCTYPE html> <html> <head> <title>background change</title> </head> <body> <button id=”tio”>click</button> <script> document.getElementById(“tio”).onclick= function(){ alert(‘hello, i would love to know u more.’) } </script> </body> </html> OUTPUT: This is the output of the alert code above.More
- Styled button<!DOCTYPE html> <html> <head> <title>styled button</title> </head> <body> <button id=”btn”>BUTTON</button> <span>This is a styled button</span> <style> #btn{ background:blue; color:white; width:10em; height:7em; border-radius:20em; border:solid; border-color:green gold; border-width:1em; } </style> </body> </html>More
- How to alert with button.<!DOCTYPE html> <html> <head> <title>background change</title> </head> <body style=”background:black;text-align:center;”> <h1 style=”background:blue;”>Click button to alert</h1> <button id=”tio” style=”background:blue;width:20em;height:5em;”>click</button> <script> document.getElementById(“tio”).onclick= function(){ alert(‘hello’) } </script> </body> </html>More
- Background change onclick.<!DOCTYPE html> <html> <head> <title>background change</title> </head> <body> <div onclick=”change(this)” style=”background-color:red;width:100%;height:30em;color:blue;text-align:center;line-height:30em;”>click me to change</div> <button id=”tio”>click</button> <p id=”tfr”>i am a boy</p> <button id=”ctc” onclick=”answer()”>change</button> <script> function change(element){ let gyt= element.style.backgroundColor; if (gyt == “red”){ element.style.backgroundColor=”green”; } else{ element.style.backgroundColor=”red”; } } </script> </body> </html>More
- Body Font SizeIn the table below, select a body font size in pixels (px) to display a complete “px to em and percent” conversion table. Tip: The default font size is usually 16px.pxempercent 5px 0.3125em 31.25% 6px 0.3750em 37.50% 7px 0.4375em 43.75% 8px 0.5000em 50.00% 9px 0.5625em 56.25% 10px 0.6250em 62.50% 11px 0.6875em 68.75% 12px 0.7500em 75.00% 13px…More
- How to creat a tooltip<!DOCTYPE html><html> <head> </head> <body> <div class=”tooltip_div”>Left Tooltip<span class=”tooltip”>This is the Tooltip text</span></div> <style> body {text-align:left;}.tooltip_div { position: relative; display: inline-block;} .tooltip { visibility: hidden;}.tooltip_div:hover .tooltip { visibility: visible;} </style> </body> </html>More
- Simple way to creat calculator with HTML,CSS & JS.<!DOCTYPE html> <html> <head> <tittle>calculator</tittle> <style> table{ border:20px solid blue; background:black; border-radius:30px; height:auto; } input[type=button]{ color:white; height:100px; width:60px; background:blue; } input[type=text]{ height:100px; width:308px; background:blue; border-radius:20px; color:red; } input:active[type=button]{ background:red; border:black 10px solid; border-radius:20px; } body{ background:rgb(40 60 80); } </style> </head> <body> <table> <tr> <td> <input type =”text” id=”result” disabled> </td> </tr> <tr> <td> <input type=”button”…More
- HTML basic tagshtml basic tagsMore
- HTML code Skeleton<!DOCTYPE html> <html> <head> <title>….</title> </head> <body> </body> </html>More
- Faster, More Flexible Editing of Your Sidebars, Headers, and Footers: Blocks for WidgetsGreat news: the block editor you’re familiar with in pages and posts is now part of the widgets editor. Faster, More Flexible Editing of Your Sidebars, Headers, and Footers: Blocks for WidgetsMore
