홈페이지 하단의 주소와 누가 만들었는지 넣어보자!(2)

이번 글에서는 홈페이지 하단의 주소와 Designed by 누구누구 이런 것을 만들어봅시다!

홈페이지 Layout을 어떤것을 만들어야 할지 잘 모르시면 W3CSchool에 들어가시면 CSS Layout이 있습니다!

아래 링크에요!

https://www.w3schools.com/css/css_website_layout.asp

CSS Website Layout

저도 이 사이트에 있는 footer 부분을 참고해서 만들었습니다..

우선 완성작부터 보여드리겠습니다.

화면 하단에 이렇게 길게 표시가 될 것입니다. div를 사용해서 block으로 전체를 차지하기 때문에 이렇게 길어진 것입니다. 코드를 보여드리겠습니다

address

태그는 말 그대로 주소나 저런 정보들을 작성할 때 쓰는 태그입니다. 물론 다른 태그를 사용을 하실 수도 있는데

저는 이 태그를 사용을 하겠습니다

span

div와 같은 역할을 하지만 inline이라  단락이 나눠지지 않아서 사용을 했습니다.

물론 본인이 만들때 필요하지 않으시면 안하시고 그냥 줄을 바꿀 때 사용하는 <br>만 사용하셔도 됩니다.

텍스트를 중앙 정렬을 시켜주고 padding을 10px만큼 줘서 여백을 만들었습니다

이 수치는 개인이 만드는 홈페이지에 따라서 조절을 해주세요!

font-weight

폰트의 굵기를 정하게 해주는 속성입니다!

각 수치마다 굵기가 달라지게 됩니다

bold를 작성할 수도 있고 저처럼 수치를 작성할 수도 있습니다.

 

아래 있는 Designed by도 위의 코드에서 추가를 하거나 살짝 변경을 해서 만든 코드이기 때문에

혼자서 충분히 만들어내실 수 있으실 겁니다.