Float를 연습해보는 시간을 갖던 중, 원하는 대로 요소들을 배치하지 못하고 있단 사실을 깨달았다. 이유를 나름대로 고민해봐서 내린 결론은... 시멘틱 태그들이 어떤 display를 가지고 있는지 확실히 모른다는 것이었다. 그런 의미에서 display의 block, inline, inline-block에 대해 짚고 넘어 가보려 한다. Block 기본적으로, 부모 요소의 너비(width)를 모두 차지하려고 한다. 그렇기에, 블록 레벨 요소들은 새로운 줄에서 시작하며, 너비와 높이, 상하좌우 마진을 설정할 수 있다. 블록 레벨 요소로는 헤딩 태그인 ~, , , , , , , , , , 등이 있다.(주로, 구조나 컨테이너의 역할을 한다.) Inline 기본적으로, 컨텐츠가 가지고 있는 영역만큼의 너비만을 차..
3주차 회고 (23.6.5~6.9) - 어떤 것을 배웠고, 실천하였는가 공휴일이었던 6월 6일을 제외하고, 4일 동안 전반적으로 CSS에는 어떤 속성들이 있고, 어떻게 사용하는지 배우는 시간었다. 단순히 강의를 듣는 것뿐만 아니라, 수업 중간중간에 시간을 주시고 실습하는 시간이 주어졌다. 추가적으로 월, 수, 금에 나온 과제를 통해 배웠던 CSS를 적절하게 사용하는 법을 배웠다. - 느낀 점 CSS에서 박스모델부터 시작해서, 리스트 스타일링, 배경 스타일링, 플로팅 레이아우스 포지셔닝 레이아웃, 테이블 및 폼스타일링, 트랜스폼, 트랜지션, 애니메이션, 플렉스 박스, 그리드 등을 배웠다. 상대적으로 최신 레이아웃 방법인 flex나 grid 같은 경우는 아직 IE 10이나 11에서조차 완벽하게 지원되진 않는..
우리는 흔히 티스토리와, 벨로그, 깃허브에서 글을 작성 시에 볼 수 있는 마크다운을 볼 수 있다. 개인적으로 깃허브의 README.md를 잘 만들어보고 싶어서, 인터넷 강의를 보고 실습했던 내용을 정리해보고자 한다. 마크다운(Markdown)이 뭐지? 🧐 웹 작성자를 위한 텍스트-HTML 형식 구문입니다. 마크다운을 사용하면 읽기 쉽고 쓰기 쉬운 일반 텍스트 형식을 사용하여 작성한 다음 구조적으로 유효한 XHTML(또는 HTML)로 변환할 수 있습니다. - 마크다운 공식사이트 정의 그대로, 글을 간편하게 작성할 수 있게 해주고 HTML이나 XHTML로 변환해주는 보조도구라고 할 수 있다. 마크다운을 작성하는 방법! ✏️ 제목(Header) #의 개수로 h1~h6까지 표현이 가능하다. # h1 ## h2 ..
2주차 회고 (23.5.29~6.2) - 어떤 것을 배웠고, 실천하였는가 대체 공휴일이었던 5월 29일을 제외하고, 4일 동안 2.5일은 HTML 5의 전반적인 콘텐츠의 요소(태그)들을 배우고, 1.5일은 CSS와 그 속성들을 배우는 시간을 가졌다. 이번 주는 배운 내용을 복습하고, 지난 주에 배웠던 Git을 정리하고, 개인적으로 마크다운을 정리하는 시간을 가졌다. + 그 외로, 멋사 동기들과 만든 코딩테스트 스터디의 포문을 열었다. - 느낀 점 이전에는 HTML을 잠시 공부할 때, 어떤 기능을 하는 태그를 암기해서 활용하는 게 고작이었다. HTML 5에서 성격에 따라 요소들을 묶어 그룹화 콘텐츠 모델 개념이 등장했음을 배우고, 콘텐츠마다 요소들을 그 목적과 함께 들으니, 그 많았던 요소들을 어느 정도 ..
