본문 바로가기

전체 글

 (59)
프론트엔드 - html, css (웹사이트 만들기 1) 발목을 다쳐서 응급실에 갔다오고,,, 정신 없는 하루를 보내느라 오늘은 따로 영상을 찾아보지않고 개인 프로젝트를 보강하는 작업을 했다. 카테고리 메뉴들을 재배치하는 작업 display:inline, display:inline-flex에 깊게 파고들어봤다. inline 요소에는 등이 있으며, block 요소는 등이 있다. inline요소는 일렬로 늘어선 방식으로 표시하며 줄바꿈을 하지않는다 각 요소마다 width는 자동으로 크기에 맞게 변형됩니다. block은 inline요소를 block을 표시합니다. inline-block은 display:block이 필요하지만 표시는 inline으로 표시하고 싶은상황에서 widht, height등 속성을 사용하고 싶을때 사용한다. display:flex를 설정하면 모든..
프론트엔드 - html, css (웹사이트 만들기 1) 오늘은 css에 대해서 배웠다. 여러가지 css기능을 배웠는데 그중에 제일 깊게 파고들어야 할 만한 것이 아래 4가지 인 것 같다. block 전후 줄바꿈이 들어가 다른 엘리먼트들을 다른 줄로 밀어내고 혼자 한 줄을 차지한다 inline 전후 줄바꿈 없이 한 줄에 다른 엘리먼트들과 나란히 배치된다 margin 바깥쪽여백 padding 안쪽여백 li{display:inline; width:100px; margin-left:59px;} 배운 내용을 개인 프로젝트에 만드는데 사용한 코드이다 윗 코드는 li에 메뉴 키워드들이 들어있었는데 각각의 메뉴들을 나란히 배치하기 위해 display:inline;을 사용하였고, 내가 원하는 위치에 맞게 설정하도록 width:100px;, margin-left:59px;을 ..
프론트엔드 - html, css (웹사이트 만들기 1) 개발에 앞서 내가 무엇을 만들고 싶은지를 설계하는 과정을 가져보았다. 1. 패션 웹 브라우저 2. 인테리어 웹 브라우저 오늘은 배운 기술로 인테리어 웹브라우저를 내가 원하는대로 개발을 해보았다. 그전에 오늘 배운 기술들을 작성해보자. = 문장을 강조 할 때 사용한다 쉽게 말하자면 블로그를 작성할때 굵게 표현하는 기능이다. = underline 문장 아래 밑줄을 만들때 사용한다 태그보다는 빈도수가 적다 = 줄바꿈 태그 = li의 부모태그 = ul의 자식태그 = 링크를 입력할 수 있는 태그, href = ""라는 속성을 사용하여 정확한 정보를 전달해줘야한다 = 이미지를 웹 브라우저에 불러오는 태그, src=""라는 속성을 사용하여 정확한 정보를 전달해줘야한다 = 동영상을 웹 브라우저에 불러오는 태그 위에 보..

티스토리툴바