분류 전체보기32 srcset 참조 : https://developer.mozilla.org/ko/docs/Learn/HTML/Multimedia_and_embedding/Responsive_images 2020. 3. 26. <em></em> 요소는 텍스트의 강세를 나타냅니다. 요소를 중첩하면 더 큰 강세를 뜻하게 됩니다. 2020. 3. 26. display : initial initial 키워드는 속성의 초깃값(기본값)을 요소에 적용합니다. 초깃값은 브라우저가 지정합니다. 모든 속성에서 사용할 수 있으며, all에 지정할 경우 모든 CSS 속성을 초깃값으로 재설정합니다. 참조 : https://developer.mozilla.org/ko/docs/Web/CSS/initial 2020. 3. 26. figure ■ figure : 독립적인 콘텐츠를 표현합니다. 사용해 설명을 붙일 수 있습니다. 피규어, 설명, 콘텐츠는 하나의 단위로 참조됩니다. 이미지 밑에 설명을 붙일 때 주로 사용 참조 : https://developer.mozilla.org/ko/docs/Web/HTML/Element/figure 2020. 3. 26. '2020.03.26 반응형 이미지 최근에는 해상도에 따라서 다른 해상도의 이미지를 제공하는 방식으로 한다고 함. 참고 : 고밀도 디스플레이를 위한 이미지 다루기 1. 2개의 이미지를 제공하여, 해상도나 미디어에 따라 다른 이미지를 제공 / 쿼리를 활용 // 장점 : 호환성이 좋음 2. srcset 을 이용하여 다른 해상도의 이미지를 제공 // 장점 : 편함 * 다음 트로이 / 기기별 해상도 제공 3. 쿼리를 활용하여 백그라운드 이미지 파일 변경 2020. 3. 26. '2020.03.26 script 파일 로드의 위치 1. 헤드태그 사이에 위치 - 해드태그에 들어간 script 파일은 바디태그의 객체를 읽기 전으로, 객체가 null로 표현됨 해드 태그 사이에 script가 존재할 것이라면, window.onload = function(){} 을 사용하는 것이 좋음 (페이지가 완성이 되었을 때 우항의 function이 실행되어라) 2. 바디태그가 끝나기 전에 script를 넣게 되면, 차례대로 페이지를 로드하기 때문에, window.onload가 필요없음. 속도면에서도, 2번의 방식이 조금 더 빠름. 해드 태그 사이에 스크립트가 있다면, 브라우저는 스크립트를 먼저 해석하여 렌더링이 지연됨 3. window 모든 객체를 포함하는 객체 / 전역객체 DOM - document object mod.. 2020. 3. 26. 1줄 / 2줄 줄임 1. 스크롤바가 생기면 안됨 2. 주석을 잘 달자 3. 반응형은 한 섹션단위로 확인해가면서 하자 4. 1줄 줄임 text-overflow 사용 조건 ! white-space는 엔터키가 적용되지않는 속성으로 사용해야되고 (no-wrap / pre) / over-flow:hidden이 들어가야하고, width 값이 고정적이여야지 가상요소로 ・・・ 5. 2줄 줄임은 webkit을 활용해야함. 2020. 3. 24. 배열/객체 1. 배열의 순서가 없음 / 이름이 있는 상자 / 객체 배열 [] / 객체 {} ex. var coworkers = { "programmer":"egoing" "designer":"leezche" }; programer 는 라벨이고 내용은 egoing designer 는 라벨이며, 내용은 leezche 객체를 추가할 때는 coworkers.bookkeeper = "duru"; 와 같은 방법으로 추가. 마찬가지로 배열을 추가할 수도 있음 coworkers["data scientist"] = "taeho"; 와 같은 방법으로 배열로 추가하고 이를 가져올 때는 배열의 방식으로 documnet.write(["data scientist"]); 로 가져올 수 있음. 2020. 3. 24. 이전 1 2 3 4 다음