HTML Span Tag – How to use span tag in HTML Coding

JP — Fri, 14 Jun 2019 14:53:26 +0000

The HTML Span Tag is useful for applying custom styles to inline elements. It is a generic inline container for various inline elements. Under the span tag container, you can set the style and then implement them to different elements.

There are two ways in which you can use the HTML Span tag. In a first way, you can declare the styling in a different place under the

HELLO EARTH!

This effect is due to the span
Follow for more
Interesting articles!

OUTPUT:-

HELLO EARTH
This effect is due to the span
Follow for more
Interesting articles!

In a second way, you can define the inline style under the span tag. The syntax will be:


<span style=""> Text goes here </span>

Let’s understand it better by looking at this example.


<! DOCTYPE html>
<html>
<head>
<! -- it’s the second way to use span tag -->
</head>

<body>

   <h4> HELLO EARTH </h4>
   <span style="color:blue;"> First Text </span> </br>
   <span style="background-color:lightgreen;"> Second Text </span> </br>

</body>
</html>

OUTPUT :-

First Text
Second Text

Difference between HTML Span tag and Div tag

The Span HTML tag and Div HTML tag have a very handsome difference in them. First of all tag is inline element whereas

tag is block-level element. However, both tags don’t require attributes with common CSS and class. Span tag takes only required width whereas the Div tag takes the whole width which is available.

Use Mettl to automate your Coding Assessment Test.

More Articles:

The post HTML Span Tag – How to use span tag in HTML Coding appeared first on JP.

HTML vs CSS – Must Know Difference Before Start Learning

JP — Fri, 14 Jun 2019 14:51:33 +0000

Hypertext markup language (HTML) and Cascade Styling Sheets (CSS) are the most popular programming languages for website development. Although HTML is not a programming language, for now, to compare HTML vs CSS, we can consider HTML as a programming language. However, to build a perfect website the HTML and CSS both are necessary. So, let’s know how they are different from each other.

HTML vs CSS

How they are different?

In simple words, both languages have their own very different functionalities. HTML is used for creating the content of the website like images, texts, pages, links, etc. CSS is responsible for styling or designing that content. To make it clearer we can tell that the doors, windows, and shacks of a house are made using HTML and the painting or designing of the home is done using CSS.

Another example is that, HTML is used to make our head and body. Whereas looks and appearance are the part of CSS. It makes the first point clear about CSS vs HTML.

HTML

After looking at the above illustration you might have got the basic idea behind both the languages. In fact, this is not only the thing in HTML vs CSS. HTML allows you to add content like paragraphs, images, hyperlinks and other information on webpages. Just like you have opened a new word document and adding stuff.

Moreover, HTML is also useful for linking the pages. It is the backbone of a webpage. So for creating any webpage HTML is Must. Without it, you can’t imagine a website.

CSS

Now talking about Cascade Styling Sheets (CSS). You have created paragraphs, headings, pictures, bullets, and much more things. Now, it’s time to style them. So, our website looks well organized. For that, you need to use CSS. All the syntaxes in CSS work hand to hand with HTML.

Both are like best friends. Whatever CSS tells HTML elements it follows. It changes color, background color, font size, font style depending upon what CSS tells. So there is actually no fight between CSS vs HTML. Both require for a good website.

Conclusion (CSS vs HTML)

To sum up all the things in one place, HTML is a markup language useful for adding content on a webpage. On the other hand, CSS is used for tailoring pages and changing fonts, colors and layouts. So, we can’t say that one is better than another. Both are very important.