HTML,CSS 화면구성하기(부트스트랩 활용)

1) HTML

2)CSS

웹 화면구성의 기본인 html, css를 간단히 실습하기!

HTML로 div안에 이름지정해서 페이지 나눠주고 뼈대를 만들어줍니다!

배우기 전엔 저화면이 외계어 같았는데 이젠..보인다리..ㅋㅋㅋ

 

화면안에 박스만드는거라고 보면되는데

너비, 간격, 색, 라인 등 값으로 지정해서 모양을 만들어주는 것이라 보면됨!ㅎㅎ

 

하지만 일일히 코드는 다 칠 수 없으니 부트스트랩을 이용해 코드복사복사!

https://getbootstrap.com/

Bootstrap

첫번째로 만든 페이지!

생각보다...재밌다ㅋㅋ 코드보면서 내가 구상한대로 화면에 구현되니 

잼남ㅋㅋㅋㅋ

 

 

하지만 ... 고비는 왔으니.. 바로 css

이건 html로 열심히 div묶어서 박스만들면 각각의 박스를 색이나 간격 이런것을 조정하는 꾸미기인데

오른쪽으로 버튼 띄우게하고 이런것도 일일히 계산하며 해줘야함ㅋㅋㅋ

그래도 열심히 css에 공들일수록 페이지는 이뻐짐!ㅋㅋ

 

 

 

이리...간단한 페이지도 조정하면서 간격보고 하느라

한시간남짓걸림...ㅋㅋㅋㅋㅋ

덕질반영으루 랜더스페이지로 만들었긔ㅋㅋㅋㅋㅋ

코딩1주차는 일단 이렇게 지나간..드아..ㅋㅋㅋ

 

그럼이만 총총