Basic use of HTML
Before I start
I used to be interest lot in design, especially web design. So I thought ‘why don’t I learn making the website for my own?’, and right away I went to the process. In the University I used to learn C and python but I hadn’t learnt about designing the web. Hence, I am a beginner. Also, I knew that for web design language (e.g HTML) doesn’t really require the logic. So, I thought it would be way easier to learn than programming languages such as python and C.
First start
In the start of the process, I learned about brief HTML and CSS. The concept of HTML is the code that represents area and text, and CSS is for ornament the area. We call the CSS file to HTML and apply the design.
<HTML>
HTML is composed of head and body. In the head, we include property information of the webpage and in the body, we include the content of the webpage. We look the web in the point of view of data and we make this data into elements in the HTML. To express elements we use the concept called ‘Tag’.
<tag name specific property= ‘property’>contents</tag name>
<CSS>- Cascading Style Sheet
Before selecting the tag, we should make a name tag for select. Hence, ‘class’ works as a nametag in CSS. In CSS, we can change the font, size, colour of the font and more. Then how do we use the CSS?
In the <head> ~ </head>, we make the area for <style> ~ </style>
As you can see in this project, in the area of <style> ~ </style> there are several elements that start with dot(.). This is how we define the class. Inside the bracket, we can write the design what you want to represent it. For example, .product tag is for the image in my webpage and as it says it includes width, height, what kind of image will be, position in the webpage etc. Moreover, * indicates the tag should be applied in all elements.
In the head area, you can see the URL and that is for the font of my webpage. By using this URL, we can change the font from the default font.
In this week, I made my own simple website that sells candles. I used some templates from ‘Bootstrap’. This webpage provides simple components for HTML.
https://contents.lotteon.com/itemimage/_v102657/LO/12/77/11/62/51/_1/27/71/16/25/2/LO1277116251_1277116252_1.jpg/dims/resizemc/400x400Used this image on google.
