TG Telegram Group Link
Channel: Programming Diaries
Back to Bottom
index2.html
593 B
A code for the form and "a" tag in use
A little tip left out from yesterdays article. We can also add a textarea and a dropdown option on the form. A whole HTML form code with the output will look like this.
We use a select tag. and inside that an options tag which we want to display as a dropdown. In this case it is the Gender.

And a textarea tag alone without any elements can be used as an input.

And the output on the browser is this 👇
One more thing. you can use a "placeholder" attribute to make it look like more realistic.
And the last thing on form is buttons. Button can be made with a different types of way. There is a button tag that is mainly used. But You could also use CSS or Bootstrap to edit any link or text into a button.
<button>Click Me</button>
You can also add an attribute of the type
<button type="Submit">Submit</button>
#Images
To display images on a website as a background. CSS comes in handy. But just to display an image you use an img tag on HTML. If the HTML file and the image are in the same directory. all u have to do is just state the image's name with its extension in the src attribute inside the img tag.

<img src="car.jpg"> this code will definitely display the image if the images's name is "car.jpg" and if it is the same directory as the html file.
#HTML Class and Id
These are the most important things in HTML since they help select elements in different things. either to style the html using css or make the page dynamic using javascript the elements have to be selected and this is where the class and id attributes comes in handy.
Both class and id are used to give the elements in html a specific name which can be used in other languages later. The difference between them is classes can be used many times. while id names are different with every html element. you cant use the same id name that you used in the previous lines of code.

<h2 class="city">Paris</h2>
<p class="city">Paris is the capital of France</p>

Here we used the class name two times and that is okay. But with id the names have to be different just like

<h2 id="city">Paris</h2>
<p id="capitalCity">Paris is the capital of France</p>
Visual studio code text editor latest version
#CSS
What is CSS?
CSS stands for cascading style sheets. It describes how HTML elements are to be displayed on screen. It takes the class, id and HTML tags to style them.
To use CSS in HTML there are three methods
1. Creating a file with a .css extension and linking it with the HTML using the link tag.(The most professional way).
2. using a style tag and putting all the styles in there
3. using inline method, adding the CSS directly to the element.
Using a style tag
Using inline method,
Using a single file and putting all the style codes in there.
Remember to put both the html and css file at the same directory.
All those methods to give these output in the browser.
I am really sorry I have been passive lately. I will start posting at least every two days after now. I will be writing more articles about Basic CSS properties, positioning, media queries, some awesome CSS tips and tricks. So you can go design your very own website. Or even clone the famous websites online landing pages like netflix, itunes, microsoft..etc.
HTML Embed Code:
2024/06/03 09:21:07
Back to Top