[CSS] 브라우저 스타일 초기화 크롬, 엣지, 파이어폭스, 사파리는 각각 브라우저의 디폴트 스타일을 갖고 있다. 위와 같이 간단하게 div를 생성하고 실제 브라우저로 확인하면 아래와 같은 스타일이 적용되어 있다. 이런 브라우저 기본 스타일은 초기화하여 모든 브라우저에서 같은 모양을 하는 것이 좋다. reset.css 링크를 하는 방법을 사용하면 된다. https://www.jsdelivr.com/package/npm/reset-css jsDelivr - A free, fast, and reliable CDN for Open Source Supports npm, GitHub, WordPress, Deno, and more. Largest network and best performance among all CDNs. Serving mor.. 2022. 1. 22. [CSS] favicon(파비콘) WIKI : favicon이란 인터넷 웹 브라우저의 주소창에 표시되는 웹사이트나 웹페이지를 대표하는 아이콘이다. favicon은 주소바, 페이지탭, 북마크등에 표시된다. favicon은 GIF, PNG 또는 ICO 파일로 16 X 16 (pixel) 형식이었다. 하지만 사용자의 사용 환경이 변화함에 따라 진화했다. ICO, PNG, GIF 는 대부분의 브라우저가 지원하지만 다른 확장자는 일부 지원안하기 때문에 유의해야할 것 같다. 파비콘은 예를 들어 이런것이지 않을까 생각된다. Youtube 페이지 소스에서 favicon을 검색 하면 아래와 같은 html코드를 확인할 수 있었다. 궁금증1 shortcut icon과 icon의 차이는? shortcut icon은 과거에 사용하던 방식으로 현재 사용을 지양한.. 2022. 1. 18. [CSS] Flex 속성 먼저 MDN Document를 읽는다. CSS - flex 속성은 보통 "Flexible Box"라고 읽는다. https://developer.mozilla.org/ko/docs/Web/CSS/flex flex - CSS: Cascading Style Sheets | MDN flex CSS 속성은 하나의 플렉스 아이템이 자신의 컨테이너가 차지하는 공간에 맞추기 위해 크기를 키우거나 줄이는 방법을 설정하는 속성입니다. developer.mozilla.org "display : flex" 속성은 하나의 플렉스 아이템이 자신의 컨테이나거 차지하는 공간에 맞추기 위해 크기를 키우거나 줄이는 방법을 설정하는 속성이다. 기본적으로 플렉스 아이템은 콘텐츠의 최소 너비 미만으로 줄어들지 않는다. min-width, m.. 2022. 1. 15. [CSS] Grid 속성 포트폴리오 클론 코딩 후 코드 분석중 display : grid 속성을 발견하고 관련된 내용을 알아보았다. 수학의 정석과 같은 MDN document를 읽었다. https://developer.mozilla.org/ko/docs/Web/CSS/CSS_Grid_Layout/Basic_concepts_of_grid_layout Basic concepts of grid layout - CSS: Cascading Style Sheets | MDN CSS 그리드 레이아웃(Grid Layout)은 CSS에 2차원의 그리드 시스템을 도입했습니다. 그리드는 주요 페이지 영역을 설계하거나 작은 사용자 인터페이스 요소를 배치하는 데 사용할 수 있습니다. 이 문 developer.mozilla.org GRID는 말 그대로 .. 2022. 1. 14. 이전 1 2 3 4 다음
