Chuyển đến nội dung chính

Introduction example definition of HTML

HTML Introduction

HTML means Hyper Text Markup Language. Current version of HTML is HTML 5 and the first version is HTML 1.0. HTML is one of the easiest coding language to learn. When creating a web page there are some sections one must know, such as HTML, CSS, Javascript.


HTML Structure

<!DOCTYPE html>
<html>

<head>

<title>Webpage Title</title>

<style>
/*CSS styles written here*/
</style>

<script>
/*Javascript code written here*/
</script>

</head>

<body>
<!--HTML tags written here-->
</body>

</html>

CSS style

CSS is defined as Cascading Style Sheet
  • After HTML, we should learn CSS.
  • CSS is used to give styles for the web pages. Styles include adding colors, animations, bordering styles etc.
  • CSS can be included in a web page using three different ways, we will see those in detail in CSS chapter.
  • CSS styles can be added to a webpage depending on screen height, width and its orientation. So that we can add different styles for the same html element in different devices.

<!DOCTYPE html>
<html>

<head>

<title>HTML Textbox</title>

</head>

<body>
<input type="text">
</body>

</html>
Try it
<!DOCTYPE html>
<html>

<head>

<title>Textbox with CSS style</title>

<style>
input{
box-shadow:2px 3px 5px 3px gray;
}
</style>

</head>

<body>
<input type="text">
</body>

</html>
Try it


Javascript code

Javascript is used to make web pages more interactive with users, it is used for operations such as basic client-side validation, passing the values to the server and more.



<!DOCTYPE html>
<html>

<head>

<title>Button with javascript</title>

<script>
function test()
{
alert("Test button");
}
</script>

</head>

<body>
<button onclick="test();">Click Me</button>
</body>

</html>
Try it



Refered by tutorialcodeplay

Nhận xét

Popular Posts

Autodesk ArtCAM 2017 Crack + Patch + Full Version

Autodesk ArtCAM 2017 Crack + Patch + Full Version ArtCAM is, in fact, a design tool designed more for designers than engineers, and allows designers to showcase their creativity. The software delivers a CNC modeling CAD that can be used for a variety of industries. For example, designers of signs, woodcutters, jewelry designers and many others who can produce high-quality products before they can deliver their products in two-dimensional and three-dimensional form. It's easier with this software than ever. Features and Features of ArtCAM 2017 Crack + Patch + Full Version: Support for 64-bit systems Ability to mount jewelry pieces The ability to create complex shapes Ability to cut different pieces of pages The ability to create floating vectors Save layers and shapes that you must use Availability of ready-made models available System Requirements for ArtCAM 2017 full Crack for 2017, 2018: OS: Windows 7 SP1 / 8.x / 10 for 2012: Processor Type & Speed: Intel Core 2 Duo (or equiv...

Adobe Acrobat Pro DC 2019 Portable (v19.010.20064)

Adobe Acrobat Pro DC 2019 Portable (v19.010.20064) is a software for creating PDF files. With the help of this software, the user can convert all text files, photos and other relevant documents to PDF format. Adobe Acrobat software is popular with many software users due to the compatibility with most software. You can plan it in the printer's configuration area by typing Ctrl + P keys that are specific to print operations, print texts or anything printable in Adobe Acrobat as a PDF. Adobe Acrobat software features Ability to convert to other formats like images and Word Scan directly from the scanner The presence of internal OCR to identify texts Optimized mode for displaying documents as much as possible Specific compatibility with high-quality images to showcase the best of the documents Ability to do things in a batch like conversion Ability to add new actions to PDF documents Ability to interconnect multiple PDF documents Ability to build form System Requirements Operating Sys...

Move up and down listbox item using javascript

     In the following example,we can easy to move the list box item up and down using javascript code. Example     function listboxMove(listID, direction) {       var listbox = document.getElementById(listID);       var selIndex = listbox.selectedIndex;       if (-1 == selIndex) {         alert("Please select an option to move.");         return;       }       var increment = -1;       if (direction == 'up')         increment = -1;       else         increment = 1;       if ((selIndex + increment) < 0 ||         (selIndex + increment) > (listbox.options.length - 1)) {  ...