Minsoftk

21.10.26 오타, 코드 블록 수정 CSS 12. 레이아웃 12.1. display - inline, block, inline-block inline 영역의 크기가 내부 콘텐츠 크기로 정해진다. width, height로 크기를 변경할 수 없다. margin, padding의 top과 bottom을 지정할 수 없다. 여러 요소가 가로 배치가 된다. block 영역의 크기를 width, height로 지정할 수 있다. width를 지정하지 않으면 가로 전체를 차지한다. 여러 요소가 세로 배치가 된다. inline-block : ex) input inline과 block의 성질을 둘 다 가진다. 영역의 크기를 width, height로 지정할 수 있다. 여러 요소가 가로 배치가 된다. 즉, inline ..

21.10.26 용어 수정 HTML head 7. 메타데이터 요소 메타데이터란 데이터를 설명하는 데이터를 메타데이터라고 한다. 예를 들어 책 맨 앞쪽에 책에 대한 정보들이 나열돼 있다. 이런 데이터를 설명하는 데이터를 메타데이터라고 한다. HTML 요소는 기계가 식별할 수 있는 문서 정보(메타데이터)를 담습니다. 정보로는 문서가 사용할 제목, 스크립트, 스타일 시트 등이 있습니다. : 문서 제목 요소 페이지 제목은 SEO에 큰 영향을 준다. 보통, 짧고 일반적인 이름보다 길고 상세한 제목이 더 좋은 성과를 내곤 한다. 검색 엔진 (en-US)이 결과 페이지의 순서를 결정하는 구성 요소 중 하나가 페이지 제목의 내용이기 때문. meta 요소가 제공하는 메타데이터는 4가지 유형이 있다. 속성 뷰포트 뷰포트(..

21.12.28 crossorigin 내용 수정 HTML Element 🤔비슷한 태그들을 구별해서 쓰는 게 왜 중요할까? 사실 사소해 보여 잘 와닿지 않았다. 시각적으로 태그들의 차이가 거의 없었기 때문이다. 그래서 별생각 없이 태그들을 썼을 때가 많았다. 하지만 개발자와 브라우저 관점에서 살펴보자. 개발자들이 필요한 정보를 찾을 때, 정확한 태그들을 사용해줘야 필요한 정보들을 빠르게 찾을 수 있을 것이다. 또한 스크린 리더 같은 프로그램을 사용할 때, 웹에서 와 달리 에 악센트를 준다고 한다. 이런 예시를 듣고 나니 가독성이나 웹 접근성 측면에서 정보들을 올바른 태그를 사용해 구분을 잘해주는 것이 중요하다고 생각이 들었다. 1. HTML 텍스트 요소 1.1. ~ : 제목 제목을 나타내는 태그로만 알고 ..

1. HTML, CSS에 대한 기본기 웹 개발을 처음 경험하면서 JS 공부도 없이 React부터 공부를 했다. 하지만 이후에 JS에 대한 이해도가 떨어져 React를 제대로 활용할 수가 없었다. 그래서 기본기가 중요하다고 생각을 했다. 배우는 것은 빠르지만 그만큼 잊어버리는 것도 빠르다. 잊지 않기 위해서 블로그에 기록을 하고 있다. 화면 구성은 CSS 프레임워크를 사용했었다. 템플릿을 가져와 만들다 보니 정작 내가 원하는 대로 UI를 만들 수 있는가?라는 질문에 'Yes'라고 답을 할 수 없었다. 만들긴 해도 엄청난 시간이 들어갔고, 기본적인 개념에서 흔들렸다. 결국 기본이 부족했다. 템플릿을 사용하지 않고 내가 원하는 대로 UI를 만드는 것이 생각보다 어려웠다. 그래서 결국은 React에서 HTML까..