1. https://codepen.io/ CodePenAn online code editor, learning environment, and community for front-end web development using HTML, CSS and JavaScript code snippets, projects, and web applications.codepen.ioHTML, CSS, JS를 바로 볼 수 있다. 또한 다른 유저들이 사용한 포맷을 활용 할 수 있고, 내가 작성한 폼에 URL을 공유해서 다른 사람과 소스코드를 공유할 수 있다는 장점이 있다. 2. https://devdocs.io/ DevDocsFast, offline, and free documentation browser for deve..
내용 css 를 활용한 퀵메뉴 입니다.
화면 스크린 크기에 따라 표시 / 숨김 - 반응형 테마에서 모바일 데스크탑에서만 보이게 / 안보이게 1. 화면 사이즈가 450px 이하일 때만 보이는 코드 /* 화면 사이즈가 450px 이하일 때만 표시 */ @media screen and (min-width: 450px) { #HTML {display:none;} } /* 화면 사이즈가 999px 이상일 때만 표시 */ @media screen and (max-width: 999px) { #HTML {display:none;} } 2. 접속하는 화면 크기에 따라, 보여줄 내용을 각각 다르게 (1) CSS 내용 /* 접속하는 화면 크기에 따라 표시/숨김을 제어 */ /* 640보다 작을경우 */ @media all and (max-width: 639px..
1. 취약점 개요 폴더나 파일명의 위치가 예측 가능하고 쉽게 노출되어 공격자가 이를 악용하여 대상에 대한 정보를 획득하고 민감한 데이터에 접근 가능 2. 개선방향 . 웹 디렉터리를 조사하여 [표. 삭제해야 할 파일 확장자]에 포함된 백업 파일을 모두 삭제하고, *.txt 같이 작업 중 생성된 일반 텍스트 파일이나 이미지 파일 등도 제거함 . 백업 파일은 백업 계획을 수립하여 안전한 곳에 정기적으로 백업해야 하며 웹 서버 상에는 운영에 필요한 최소한의 파일만을 생성하여야 함 . 웹 서버 설정 후 디폴트 페이지와 디폴트 디렉터리 및 Banner를 삭제하여 Banner Grab에 의한 시스템 정보 유출을 차단함 . Apache, IIS, Tomcat 등 각 웹 서버 설정 시 함께 제공되는 샘플 디렉터리 및 매..
브라우저의 동작 원리를 간단하게 설명해 주세요. 브라우저의 기본적인 역할은 HTML, CSS 명세에 따라 HTML 파일을 해석해서 표시하는 것이다. 브라우저를 구성하는 요소는 사용자 인터페이스, 브라우저 엔진(크롬, 사파리는 Webkit, 파이어폭스는 Gecko), 렌더링 엔진, 통신, UI 백엔드, 자바스크립트 해석기, 자료 저장소 등이 있다. 렌더링 엔진은 먼저 HTML 문서를 파싱해서 DOM 트리를 구축한다. 그리고 CSS 마크업을 파싱해서 앞서 구축한 DOM 트리와 함께 렌더링 트리를 만든다. 렌더링 트리는 화면에 보여줄 것들만 가지고 있는 트리로, 구축이 되면 순차적으로 화면에 배치한다. 부모에서 자식 순서로 배치는 진행된다. 배치가 완료되면 그리기를 시작한다. CORS가 무엇이며 어떻게 해결을..
HTML5은 현재 W3C를 통해 최종 권고안(Recommendation)이 채택되지 않았고 W3C에서 최종 권고안(Recommendation)까지 5 단계 절차 중 현재 Working Draft 상태임에도 불구하고 전세계 IT, 특히 소프트웨어 분야는 HTML5가 하나의 큰 주류를 형성하고 있습니다.HTML5는 기존의 기술인 HTML이나 XML 기반의 HTML인 XHTML을 벗어나 전혀 새로운 기술이 아니며 기존 기술을 바탕으로 보다 체계화되고 새로운 기능이 추가되고 있는 기술입니다.HTML5의 실제적인 내용을 학습하기 앞서 HTML5의 모태가 된 HTML이 어떻게 시작되었는지를 알아보는 것도 의미가 있을 것 같습니다. 1989년 Tim Berners-Lee는 다양한 문서들을 연결하기 위해서 제한된 규격..