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가 무엇이며 어떻게 해결을..