All TalkersCode Topics

Follow TalkersCode On Social Media

devloprr.com - A Social Media Network for developers Join Now ➔

How To Use Sublime Text For HTML

Last Updated : Mar 11, 2024

How To Use Sublime Text For HTML

In this tutorial we will show you the solution of how to use sublime text for HTML, Sublime text is an IDE used for development of html project. You can use sublime for many other languages expect HTML.

But today we will talk about html in sublime let us understand how we able to use html in sublime.

Step By Step Guide On How To Use Sublime Text For HTML :-

Now, here below we are going to show you some codes in html that you can use to type sublime for better understanding.

Here, below we provide you some shortcut codes to make a format in html of that code.

Basic HTML document

For basic html document, you have to open a new page and save it with filename.html and under this you have to write.

doc/ ! / html:4t

You have to write anyone from above and press enter. Then automatically a full format of html appears in file.

Writing simple HTML tag

For creating a simple html tag, you just have to type name and press enter like for footer you have to write footer and then enter.

Similarly, for section, division, header, bold you have to write section, div, header and b. Then when you press enter both open and close tags appears there.

Assigning attributes to elements in HTML

If you have to assign attributes to html from sublime, then you like CSS for id you have to use (#) and for class, we have to use (.). let us understand this with help of example:

Code:
#createid
.createclass
Or
section.class
h1.id
Result:
<div id=”createid”></div>
<div class=”createclass”></div>
Or
<section class=”class”></section>
<h1 id=”id”></h1>

Creating sibling elements

For creating or adding siblings, you have to use + sign. And the codes for example are as:

header+section+division*3+footer
When you press enter, it shows:
<header></header>
doc/ ! / html:4t
<header></header>
<section></section>
<div></div>
<div></div>
<div></div>
<footer></footer>

Creating child element/ nesting also

For creating child element and for nesting you have to use >. For example:

header>nav>ul>li*3
the result may appeared as:
<header>
<nav>
<ul>
<li></li>
<li></li>
<li></li>
<ul>
<?nav>
</header>

Multiplication

Multiplication is used where we have to use more tags instead of one like.

ul>li*6

The result of this code is as below:

<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>

Dummy text example

Here, we will show you the basic way with the help of which you are able to create a dummy text in any tag in sublime text.

lorem
lorem100
p>lorem50
ul>li*3>lorem10

Hence, here lorem is used to show you dummy text in sublime with the help of html.

You can also specify the number of words with lorem to specify how many words you want. You can use this in any html tag.

Here, we show you some examples to use sublime text for html. All the above codes are used for html and we hope that you understand codes.

Conclusion :-

In conclusion, here we can say that with the help of this article you know about many things that you can use to create a sublime document in html.

These are all the basic coding ways. I hope this tutorial on how to use sublime text for HTML helps you.

Author Image About Anjali

Experienced Computer Programmer with a broad range of experience in technology. Strengths in application development and Object Oriented architecture design, front end programming, usability and multimedia technology. Expert in coding languages such as C, C++ Java, JavaScript, PHP and more.

Follow Anjali On Linkedin 🡪