Notice
Recent Posts
Link
«   2024/12   »
일 월 화 수 목 금 토
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30 31
Tags more
Archives
관리 메뉴

목록💡깨달음💡 (75)

공부기록용

슬라이드 만들기(slick.js 만들어보기01)

body { margin: 0; } ul, li { margin: 0; padding: 0; list-style: none; } img { width: 400px; } button { padding: 0; } /* */ body { position: relative; height: 100vh; } .contanier { width: 1240px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .slide { border: 5px solid #000; width: 100%; height: 250px; /* overflow: hidden; */ position: relative; } ul { border: 1px so..
💡깨달음💡/Javascript 2024. 4. 4. 17:35
생성자 함수

생성자 함수 "객체를 생성하는 역할을 하는 함수" 함수의 이름의 첫 글자는 대문자로 시작한다. 일반 함수와 구분하기 위함 'new'연산자를 붙여서 실행한다. new 키워드를 사용하지 않으면 일반적인 함수와 동일하게 동작하여 새로운 객체를 반환하지 않는다. 생성자 함수엔 보통 return 문이 없다. 반환해야 할 것들은 모두 this에 저장되고, this는 자동으로 반환되기 때문에 반환문을 명시적으로 써 줄 필요가 없다. 만약 return 문이 있다면 아래와 같은 간단한 규칙이 적용된다. 객체를 return 한다면 this 대신 객체가 반환 원시형을 return 한다면 return문이 무시 return 뒤에 객체가 오면 생성자 함수는 해당 객체를 반환해주고, 이 외의 경우는 this가 반환된다. 일반적으로..
💡깨달음💡/Javascript 2024. 3. 27. 20:02
크로스 브라우징(Cross Browsing)

크로스 브라우징(Cross Browsing) 크로스 브라우징은 `브라우저 간 상호 호환성` 을 의미하는 것이다. 서로 다른 브라우저들끼리 서로 호환이 가능하도록 하는 것을 의미한다. 하지만 여기서 중요한 것은 크로스 브라우징이 모든 브라우저에서 100% 똑같이 보이도록 만드는 `동일성`이 아닌 `동등성` 및 `등가성`을 의미하는 것이다. 크로스 브라우징 작업이 필요한 이유 브라우저 마다 랜더링 엔진이 다르기 때문으로 작동되지 않는 HTML5, Javascript 코드가 존재 해석하지 못하는 CSS 코드 존재 브라우저 버그들이 존재 브라우저마다 자체적인 CSS 스타일 고려해야 할 부분 호환성 테스트에는 웹 페이지를 구성하는 모든 것이 포함될 수 있지만, 모든 부분을 테스트할 수 없을 것이다. 그렇기 때문에..
💡깨달음💡 2024. 3. 24. 11:10
시맨틱 마크업(Semantic Markup)

시맨틱 마크업 시맨틱(Semantic)이란 "의미론적인" 의 뜻을 가지며 마크업(Markup)이란 HTML 태그로 문서를 작성하는 것을 말한다. 따라서, 시맨틱 마크업이란 의미를 잘 전달하도록 문서를 작성하는 것을 말한다. 시맨틱 마크업을 하기 위해선 각 태그를 그 용도에 맞게 사용하여야 한다. 태그가 가 지고 있는 의미에 맞게 사용하는 것으로 CSS스타일을 명시하는 태그를 사용하지 않는 것 또한 시맨틱 마크업의 한 종류이다. 즉, 태그가 가지는 의미 자체가 스타일이라면 이는 마크업 자체가 스타일을 갖틑 것이기 때눔에 시맨틱 마크업에 적합하지 않은 것이다 시맨틱 마크업을 사용하면 검색엔진이 시맨틱 태그를 중요한 키워드로 간주하기 때문에 검색엔진 최적화(SEO)에 유리하다. 웹 접근성 측면에서, 시각장애가..
💡깨달음💡/HTML 2024. 3. 24. 10:24
jQuery의 메서드(4)

🔴이펙트 효과 관련 메서드 🔻요소의 표시와 숨김 🔻fade 효과 🔻slide 효과 🔻이펙트 제어 🔻사용자 정의 이펙트_.animate() 이펙트(effect) 효과 이펙트 효과는 기본 설정으로 바로 사용할 수도 있고, animate() 메소드를 통해 설정을 변경해서 사용할 수도 있다. 요소의 표시와 숨김 .show() 선택 요소 보이기, 표시하기 .hide() 선택 요소 감추기 .toggle() 선택 요소 표시하기/감추기 ✔️ ( )안에는 지속시간을 넣어주면 된다. 작성하지 않을 경우 기본 값이 자동으로 설정되어 효과에 반영되어 진다. ' ' 안에 작성하면 되고 'fast', 'slow'처럼 문자로 작성하거나 '3s'로 작성하면 된다. 5000, 2000 처럼 숫자를 작성할 경우 ' '는 필요없다. fa..
💡깨달음💡/jQuery 2024. 2. 9. 15:45
jQuery의 메서드(3)

🔴요소의 크기 🔴요소의 위치 🔴프로퍼티 설정 🔴클래스 설정 요소의 크기 선택한 요소의 크기에 관한 정보를 손쉽게 받아오거나 설정할 수 있도록 다양한 메소드를 제공한다. .width() 선택한 요소 집합의 첫 번째 요소의 너비를 반환하거나, 선택된 요소의 너비를 인수로 전달받은 값으로 설정함. .height() 선택한 요소 집합의 첫 번째 요소의 높이를 반환하거나, 선택된 요소의 높이를 인수로 전달받은 값으로 설정함. .innerWidth() 선택한 요소 집합의 첫 번째 요소의 너비에 패딩 영역을 포함한 너비를 반환함. .innerHeight() 선택한 요소 집합의 첫 번째 요소의 높이에 패딩 영역을 포함한 높이를 반환함. .outerWidth() 선택한 요소 집합의 첫 번째 요소의 너비에 패딩 영역과 테..
💡깨달음💡/jQuery 2024. 2. 9. 15:15
이전 Prev 1 2 3 4 5 6 7 ··· 13 Next 다음