DEV Community

Auxilia Sarin Pinkcy R
Auxilia Sarin Pinkcy R

Posted on Edited on

My First Project

In my First Project I tried to clone a Web Page Layout.And also learnt the properties inside.First to understand and generate the code easier i considered each as individual box as HTML is a box model.
The box model is a layout concept where every element comes in a rectangular box composed of four layers.
1.Margin:The outermost layer outside the border.It moves the elements away to create outer spacing.
2.Border: A line that is around padding and content.We can customize its thickness,style,color.
3.Padding:Transparent space surrounding the content.It provides inner space.
4.Content:The innermost core where text,images appear.The dimensions are controlled by the height and width properties.

I divided the layout into Header,Section,Footer then first generated HTML code then I tried CSS code under style tag using Internal CSS.

In Header section i created my name with heading tag and four different menu with navigation tags.

In Section i divided into three sections and in each section I created the content in different ways
In first section I made it inside a paragraph tag.
In second section I listed the content by bullets using unordered list tag.

In third section I listed the content by numbers using ordered list tag.
Here i learnt about
ordered list : The content is listed using numbers.
unordered list: The content is listed using elements like bullets.

In Footer section I created the content using a paragraph tag.

That's how I Cloned a simple web page.I'm Looking Forward to learn more through new different projects.





Top comments (0)