-
[JS] 호이스팅JavaScript 2019. 8. 2. 14:44
호이스팅 변수의 호이스팅 function foo() { console.log(a); // undefined var a = 100; console.log(a); // 100 } foo(); 다른 프로그래밍 언어의 경우 위의 코드를 실행하면 a가 선언되지 않았는데 a를 호출했기 때문에 에러가 발생합니다. 하지만 자바스크립트의 경우는 호이스팅을 통해 a의 선언을 함수 제일 위에서 해주기 때문에, 에러 없이 undefined가 출력됩니다. 위 코드는 사실 아래와 같은 코드입니다. function foo() { var a; console.log(a); // undefined var a = 100; console.log(a); // 100 } foo(); 함수의 호이스팅 foo(); function foo() { ..
-
[HTML] form 스터디카테고리 없음 2019. 4. 9. 01:56
크로스브라우징 이슈 iOS safari input, textarea 태그에 border-radiuis 기본으로 값이 들어가있음 (별도로 0 지정) IE9 이하 input placeholder 사용불가 스크립트를 사용하는 [방법](https://archive.cmsfactory.net/node/10224) require 속성에 따른 브라우저별 툴팁 표시 파이어폭스 : box-shadow 속성 추가 IE : outline 속성 추가 크롬 : 미입력 input에 말풍선 툴팁 커스텀 placeholder color input { padding: 0.78571429em 2.1em 0.78571429em 1em; border-radius: 0.28571429rem; &.input_error { background-..
-
[HTML] 문서의 기본 구조HTML & CSS 2019. 3. 15. 14:56
HTML 문서 구조 HTML Hello, HTML 1. DTD 선언문서 타입을 정의하는 문구, 선언문에 따라 브라우저 렌더링 모드가 정해진다.반드시 문서 최상단에 위치, 태그보다 위에 선언돼야 한다.2. html 태그 lang 속성검색엔진이나 브라우저가 어떤 언어로 작성되었는지 알 수 있게 나타내는 속성3. head 태그브라우저에 표시되지 않는 문서의 기본정보 설정(meta, title ..)이나 외부 스타일 시트, JS 파일을 연결한다.4. body 태그실제 브라우저에서 나타나는 내용들이 들어가는 태그
-
[HTML] 웹 표준과 웹 접근성카테고리 없음 2019. 3. 1. 22:34
웹 표준이란웹 표준화 단체(W3C)가 권고한 표준안을 뜻한다.https://www.w3.org/TR/html5-author/KISA 번역본이를 준수하여 웹을 구현한다는 것과 그에 따른 효과용도에 맞는 태그 사용과 CSS를 분리하여 작업하는것이를 통해 다양한 브라우저들과 기기에서 동일한 화면을 구현검색엔진 최적화, 웹 페이지의 데이터를 의미론적으로 분석 가능진단방법W3 validator - MarkupW3 validator - CSS한국인터넷진흥원 - 기술지원센터웹 접근성이란장애 여부와 상관없이 모든 환경에서 웹 콘텐츠를 이용할 수 있어야 하는 것스크린리더를 통해 음성으로 웹 페이지 내용을 들을 수 있어야한다모든 기능은 키보드만으로 사용할 수 있어야 한다.명료성, 가독성, 콘텐츠의 논리성, 멀티미디어 대체..
-
[CSS] font-face 설정 (브라우저 호환성 고려)HTML & CSS 2018. 12. 12. 17:21
EOT(Embedded Open Type) : IE8 이하 버전은 .eot 파일만 인식oft(OpenType)/ttf(TrueType) : 웹과 문서 파일에서도 사용 가능. 대부분 브라우저에서 사용 가능 (Chrome 4+, Firefox 3.5, Opera 10+, Safari 3-5, Android, iOS 에서 지원)WOFF(Web Open Font Format) : TrueType이나 OpenType 서체를 압축한 것 (Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+, FF Mobile(Gecko) 5, Opera Mobile11 에서 지원)SVG(Scalable Vector Graphic) : (Chrome, Opera, Safari, Opera Mobile 10...
-
[JS] jQuery .on() 이벤트JavaScript 2018. 12. 11. 14:37
//이벤트 하나 $('.main-nav ul > li').on('click', function(){ }); //이벤트 둘 $('.main-nav ul > li').on('click mouseover', function(){ }); //이벤트 넷 $('.main-nav ul > li').on({ 'focusin mouseover': function () {}, 'focusout mouseleave': function () {} });