HTML: Difference between revisions

From Computer Science Wiki
 
(20 intermediate revisions by 2 users not shown)
Line 1: Line 1:
[[file:html.png|right|frame|HTML <ref>http://www.flaticon.com/</ref>]]
[[file:html.png|right|frame|HTML <ref>https://www.flaticon.com/</ref>]]


HyperText Markup Language, commonly referred to as HTML, is the standard markup language used to create web pages. Along with CSS, and JavaScript, HTML is a cornerstone technology used to create web pages,  as well as to create user interfaces for mobile and web applications. Web browsers can read HTML files and render them into visible or audible web pages.  
HyperText Markup Language, commonly referred to as HTML, is the standard markup language used to create web pages. Along with CSS, and JavaScript, HTML is a cornerstone technology used to create web pages,  as well as to create user interfaces for mobile and web applications. Web browsers can read HTML files and render them into visible or audible web pages.  
Line 11: Line 11:
</html>
</html>


Content gratefully used with permission :  <ref>http://cs50.tv/2015/fall/#license,psets</ref>
Content gratefully used with permission   <ref>http://cs50.tv/2015/fall/#license,psets</ref>


== List of input types ==
== HTML tags ==  
[[File:Html elements.png]]


The HTML <input> element is used to create interactive controls for web-based forms in order to accept data from the user.
For example, consider the following line of text:
<syntaxhighlight lang="html">
My cat is very grumpy
</syntaxhighlight>


Like almost all other HTML elements, input type has a wide range of [[attributes]]. Input types have both [https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes HTML global attributes] and [https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes specific attributes]. Remember this.
If we wanted the text to stand by itself, we could specify that it is a paragraph by enclosing it in a paragraph element:


How an <input> works varies considerably depending on the value of its type attribute, hence the different types are covered in their own separate reference pages. If this attributes is not specified, the default type adopted type is text. <ref>https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input</ref>
<syntaxhighlight lang="html">
<p>My cat is very grumpy</p>
</syntaxhighlight>


[https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input Click here the Mozilla documentation page with links to each input type]
Note: Tags in HTML are case-insensitive. This means they can be written in uppercase or lowercase. For example, a <title> tag could be written as <title>, <TITLE>, <Title>, <TiTlE>, etc., and it will work. However, it is best practice to write all tags in lowercase for consistency, readability, and other reasons.


* [[html input types - password | password]]
HTML (Hypertext Markup Language) elements historically were categorized as either "block-level" elements or "inline-level" elements. Since this is a presentational characteristic it is nowadays specified by CSS in the Flow Layout. Inline elements are those which only occupy the space bounded by the tags defining the element, instead of breaking the flow of the content.<ref>https://developer.mozilla.org/en-US/docs/Web/HTML/Inline_elements#inline_vs._block-level_elements_a_demonstration</ref>
* [[html input types - submit | submit]]
 
* [[html input types - button | button]]
== List of some HTML elements ==
* [[html input types - text | text]]
 
* [[html input types - textarea | textarea]]
You should be familiar with these tags.
* [[html input types - range | range]]
 
* [[html input types - radio | radio]]
* html - https://developer.mozilla.org/en-US/docs/Web/HTML/Element/html
* [[html input types - checkbox | checkbox]]
* head - https://developer.mozilla.org/en-US/docs/Web/HTML/Element/head
* [[html input types - datalist | datalist]]
* title - https://developer.mozilla.org/en-US/docs/Web/HTML/Element/title
* [[html input types - search | search]]
* link - https://developer.mozilla.org/en-US/docs/Web/HTML/Element/link
* [[html input types - email | email]]
* body - https://developer.mozilla.org/en-US/docs/Web/HTML/Element/body
* [[html input types - url | url]]
* h1 through h6 - https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Heading_Elements
* [[html input types - tel | tel]]
* p - https://developer.mozilla.org/en-US/docs/Web/HTML/Element/p
* [[html input types - number | number]]
* div - https://developer.mozilla.org/en-US/docs/Web/HTML/Element/div
* [[html input types - range | range]]
* ol - https://developer.mozilla.org/en-US/docs/Web/HTML/Element/ol
* [[html input types - date | date]]
* li - https://developer.mozilla.org/en-US/docs/Web/HTML/Element/li
* [[html input types - month | month]]
*  
* [[html input types - week | week]]
* ul - https://developer.mozilla.org/en-US/docs/Web/HTML/Element/ul
* [[html input types - time | time]]
* a - https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a
* [[html input types - datetime-local | datetime-local]]
* br - https://developer.mozilla.org/en-US/docs/Web/HTML/Element/br
* [[html input types - color | color]]
* small - https://developer.mozilla.org/en-US/docs/Web/HTML/Element/small
* [[html input types - hidden | hidden]]
* span - https://developer.mozilla.org/en-US/docs/Web/HTML/Element/span
* img -https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img


== Helpful resources ==
== Helpful resources ==
Line 56: Line 63:


* [[HTTP, HTTPS, HTML, URL, XML, XSLT, CSS]]
* [[HTTP, HTTPS, HTML, URL, XML, XSLT, CSS]]
 
* [[HTML forms]]
== Do you understand this? ==


== References ==  
== References ==  

Latest revision as of 20:12, 21 August 2022

HTML [1]

HyperText Markup Language, commonly referred to as HTML, is the standard markup language used to create web pages. Along with CSS, and JavaScript, HTML is a cornerstone technology used to create web pages, as well as to create user interfaces for mobile and web applications. Web browsers can read HTML files and render them into visible or audible web pages.

HTML describes the structure of a website semantically along with cues for presentation, making it a markup language, rather than a programming language.[2]

Introduction[edit]

Content gratefully used with permission [3]

HTML tags[edit]

Html elements.png

For example, consider the following line of text: 

My cat is very grumpy

If we wanted the text to stand by itself, we could specify that it is a paragraph by enclosing it in a paragraph element: 

<p>My cat is very grumpy</p>

Note: Tags in HTML are case-insensitive. This means they can be written in uppercase or lowercase. For example, a <title> tag could be written as <title>, <TITLE>, <Title>, <TiTlE>, etc., and it will work. However, it is best practice to write all tags in lowercase for consistency, readability, and other reasons.

HTML (Hypertext Markup Language) elements historically were categorized as either "block-level" elements or "inline-level" elements. Since this is a presentational characteristic it is nowadays specified by CSS in the Flow Layout. Inline elements are those which only occupy the space bounded by the tags defining the element, instead of breaking the flow of the content.[4]

List of some HTML elements[edit]

You should be familiar with these tags.

Helpful resources[edit]

See also[edit]

References[edit]

  1. ↑ https://www.flaticon.com/
  2. ↑ https://en.wikipedia.org/wiki/HTML
  3. ↑ http://cs50.tv/2015/fall/#license,psets
  4. ↑ https://developer.mozilla.org/en-US/docs/Web/HTML/Inline_elements#inline_vs._block-level_elements_a_demonstration

Give a sequence of brief answers with no explanation.

Retrieved from "https://computersciencewiki.org/index.php?title=HTML&oldid=11654"