What is Front End language?
Now we will move ahead with front end language
Different Types of Front End language
The following are the different types of front end language, which are as follows:
1. HTML language
Hypertext Markup Language we normally called HTML. HTML is used for creating digital records on the World Wide Web. A number of links to other websites are provided on each page. Each web page you view on the Internet is published in one or another HTML variant. HTML code ensures that the images and text are properly formatted so your internet browser can display them to look for; without HTML, a browser would not be able to display text as items or load images. HTML also provides a basic page structure, where cascading style sheets are superimposed to modify their appearance. A website is a document that is generally written in HTML and translated through a web browser. By entering a URL, you can identify a web page. The static or dynamic kind of web page may be. We can generate static web pages by using HTML. We will see the attributes in HTML such as documents, tags, buttons, lists, etc.
All HTML documents must start with a document type declaration:
The HTML document starts from <html>and ends with </html>. The part which we want to display on the website is declared in the HTML document is between <body> and </body>. In HTML, headings are defined using the <h1> to <h6> tags. Where <h1> represents largest heading and <h6> represents smallest heading.
<h1>This is heading with h1 </h1>
<h2>This is heading with h2 </h2>
<h6>This is heading with h6</h6>
HTML links are defined with the <a> tag
<ahref="https://www.educba.com">This is a link to educba website</a>
In HTML, images are defined with the <img> tag.
Attributes for editing images are as follows
- The source file (src)
- alternative text (alt)
<img src="educba.jpg"alt="educba.com" width="120"height="180">
You can see this small example of how Html code looks like
<title>Hello Friends </title>
<p> HTML First Page</p>
2. Java Script language
<p id="demo">EDUCBA Can Make your Future Bright.</p>
<button type="button" onclick='document.getElementById("demo").innerHTML = "Hello Server!"'>Click Me!</button>
3. C++ Language
C++ is one of the best front-end programming languages. C++ is developed by Bjarne Stroustrup. This language is also known for the extension of C, i.e., the next version of the C++ language. C++ is used for many purposes like game development, application development, operating system, animation, etc. This language is easy to learn. This feature of C++ makes it popular in the market. C++ is the basic language for all languages. C++ language has a rich set of libraries.
Program to display “Hello World”
Using namespace std;
Example to print star pattern in a diamond shape
using namespace std;
int n, s, i, j;
cout << "Enter number of rows: ";
cin >> n;
for(i = 0; i <= n; i++)
for(s = n; s > i; s--)
cout << " ";
for(j=0; j<i; j++)
cout << "* ";
cout << "\n";
for(i = 1; i < n; i++)
for(s = 0; s < i; s++)
cout << " ";
for(j = n; j > i; j--)
cout << "* ";
// ending line after each row
cout << "\n";
4. CSS language
CSS Stands for the Cascading Style Sheets. You can control the color, column size and color designs, paragraph spacing, font style, background images or colors, layout designs and display variations of different devices, screen sizes or other effects with the use of CSS. CSS is simple to know and comprehend, but it controls the presentation of HTML documents. CSS is usually paired with HTML or XHTML markup languages. You don’t need HTML tag characteristics to write each time if you use CSS. Simply write a CSS tag rule and use it for all events of the tag. Through less code, download times are quicker. For more than one device type, style sheets allow content optimization. Various website versions for handheld devices, such as PDAs, cell phones, or printing, can be presented with the same HTML document.
You can see this small example of how CSS code looks like
<h1 class="center">EDUCBA </h1>
<p class="center">Hello Are you there?</p>
You can put your CSS rules into an HTML document using the <style> element. This tag is placed inside the <head>…</head> tags. Rules defined using this syntax will be applied to all the elements available in the document.
The syntax is as follows.
<style type = "text/css" media = "all">
<p>Welcome to EDUCBA</p>
In this article, we have seen different types of Front End Languages and their syntax and examples, which will help you understand better and be much convenient to go through these topics.
This has been a guide to Front End languages. Here we have discuss what Front End languages is? different types of front end languages along with sample code. You can also go through our other suggested articles to learn more –