Posts

Showing posts with the label html

The Best Web Development Roadmap - Guide To Start Out

Image
           Web development is one of the all time trending topic to techies. The learning curve of web development has never down-sloped. Today, I will tell you the complete roadmap to be a web developer and pursue your career. I will give you a sequential overview to learn topics one after another. After learning them you will be called "A WEB DEVELOPER". Web development is always a trending career option -- Here Why    We can divide the web development into two subparts- A. Frontend development and B. Backend development. The tasks which a developer has to do are --  Make a basic markup of a page using HTML Design the webpage using CSS or any library like - Bootstrap, Tailwind, Bulma Make the website interactive with JavaScript  These steps come under frontend part. So, to handle frontend learn -- HTML, CSS, JavaScript, any  CSS library. Learn these topics one after another. Completing these you will be able to design a website and can make beautiful templates for websites.

Toggle Sidebar Code Using JavaScript in Web Development

Image
     In any modern responsive website you have surely seen an toggle sidebar which will open and close with an animation whenever the hamburger icon or menu icon is clicked. It looks nice with nice transition and is necessary to make your website responsive for mobiles.      Today, I will let you make your own toggle sidebar which you can implement in any website and give your website a modern enhancement. We will have to do three things,  1. Making the HTML of the menu button and sidebar 2. Adding CSS to the elements 3. Using JavaScript, enabling the toggle functionality. HTML:      One thing to be noted that the HTML code of the Menu and Sidebar can be given anywhere inside the body tag because we will finally give these elements fixed positions. Better put it just after the body.  <div id="mobile-navigation"> <ul> <li><a href="#">Home</a></li> <li><a href="#">Courses

How To Make Anchor Tag Link Look Beautiful ?

Image
In a website the hyperlinks are very important and discussable. The more elegant design of the link the more chances for that link to be clicked. So, it is necessary to have a good looking links. Here I will discuss the process to do this task. A website has links and these are actually <a> tags. If you write only the basic format like this -->           <a href="#">Click Here</a> It will look like a very normal link with underline------> Click Here You can see that this link is not at all attractive to be clicked.  But some lines of CSS will make it so beautiful. Let's do that. At must you have to remove that underline with property {text-decoration: none;}. Then to change the color and background {color: #fff; background: #00cc99}. But still it is not  looking so good .Now lets give padding {padding: 5px 16px;}.  You will see that padding will not work properly as the a tag is an inline element. You have to ma