전체 글170 [CSS] CSS 미디어쿼리(Media Query) 기본 사용법 1. 최소 반응형 레이아웃가장 대중적이고 많이 사용하고 있는 간결한 기준이다. 📝 미디어쿼리(Media Query) 형태// 뷰포트의 가로너비가 1025px 이상인 경우 적용 : 데스크탑 환경@media screen and (min-width: 1025px){ .. }// 뷰포트의 가로너비가 769px 이상 1024px 이하 : 태블릿 환경@media screen and (min-width: 769px) and (max-width: 1024){ .. }// 뷰포트의 가로너비가 768px 이하인 경우 적용 : 모바일 환경@media screen and (max-width: 768px){ .. }// 장치가 가로 방향인 경우 적용@media (orientation: landscape){ .. }// 장치가.. 2024. 5. 20. [TISTORY] 티스토리에 코드펜(CodePen) 적용하기 코드펜은 웹페이지에 HTML, CSS, JavaScript를 코딩함으로써 실행결과를 보여줄 수 있는 사이트 1. 코드펜(CodePen) 접속아래 링크로 들어가 계정 접속 한다.https://codepen.io/trending 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.io 2. 코드펜(CodePen) 작업로그인을 한 후 좌측 상단에 [Pen]이라는 메뉴를 선택해서 들어간다. 코드작성 후 [Save] 클릭 하단 [Embed] .. 2024. 5. 20. [CSS] CSS Flex 완벽 가이드 CSS Flex BoxFlex는 요소의 크기가 불분명하거나 동적인 경우에도, 각 요소를 정렬할 수 있는 효율적인 방법을 제공합니다. 우선 Flex는 2개의 개념으로 나뉩니다. 첫 번째는 Container 두 번째는 Items 입니다. Container는 Items를 감싸는 부모 요소이며, 각 Item을 정렬하기 위해선 Container가 필수입니다. 주의할 부분은 Container와 Items에 적용하는 속성이 구분되어 있다는 것입니다. (부모요소) Container ▶ display, flex-flow, justify-content 등의 속성을 사용할 수 있으며, (자식요소) Items ▶ order, flex, align-self 등의 속성을 사용할 수 있습니다. Flex ContainerFlex C.. 2024. 5. 20. [GitHub] 깃배쉬(Git Bash)에서 로그인한 계정 변경 삭제 방법 (Windows) 1. Git Bash 접속Git Bash에서 터미널 계정 삭제/추가 하는 방법 Git Bash복사 Ctrl + Insert 붙여넣기 Shift + Insert git config --global --unset-all user.namegit config --global --unset-all user.email user.name 삭제-- 사용자 이름을 선택하여 삭제git config --global --unset user.name 사용자이름-- 전체 사용자 이름 삭제git config --global --unset-all user.name uesr.email삭제-- 사용자 이메일을 선택하여 삭제git config --global --unset user.email 사용자이메일-- 전체 사용자 이메일 삭제gi.. 2024. 5. 20. [Tistory] 티스토리 임시저장글 불러오기, 삭제하기 글쓰기 화면에서,우측 하단 “임시저장“ [1]버튼 클릭하면 임시저장이 됩니다.임시저장 옆에 “1” [2]번호 클릭하면 임시저장되어 있던 글목록이 나타납니다. 숫자 선택을 하시면, 임시 저장되어있는 글 목록 리스 노출 휴지통 아이콘 버튼 클릭하면, 임시저장글 삭제 됩니다. 2024. 5. 20. [STS] 화면 리셋, 레이아웃 리셋 이클립스나 STS 상단 Window > Perspective > Reset Perspective Reset Perspective 클릭그러면 첫 초기 화면 레이아웃으로 변경될 것이다. 초기화 후에 로그보는 하단 화면이 평소 쓰는것들과 다르게 달라졌다면,Window > Show View 를 클릭하면 화면 종류들이 나올 것이다.원하는 것을 선택 2024. 5. 16. [JSP] <jsp:include> 액션 태그를 이용한 레이아웃 템플릿 모든 페이지에 들어가는 header와 footer 만들기 메인페이지 main.jsp에 header, footer 파일을 연결시켜준다.header 위치에 를 넣으면 네브바 포함 된 메인페이지footer 위치에 를 넣으면 footer가 포함 된 메인페이지Header 설정header.jsp Blog 로그인 회원가입 Footer 설정footer.jsp 🧍🏻♀️Created by Sohyun 📞010-1234-1234 🚩서울특별시 중구 메인페이지(main.jsp) - header, footer 파일 연결main.jsp 제목 적는 부분 내용 적는 부분 상세보기 layout 폴더가 현재 폴더위치 위에.. 2024. 5. 16. [Spring Boot] 컨트롤러 클래스 없이 특정 view대한 컨트롤러 추가 WebMvcConfigurer addViewControllers 🎯 Goal컨트롤러 클래스 없이 특정 view에대한 컨트롤러를 추가할 수 있다.💡 개념web과 WEB-INF 폴더 / WEB-INF에서의 앵커 태그에 관해서webapp폴더에 파일이 있을 경우 비즈니스 로직없이도 가상의 결과물을 만들어 직접적으로 뷰를 살펴 볼 수 있다.그렇기 때문에 http://localhost:8080/test.jsp로 접속 시 해당 페이지를 볼 수 있었던 것이다. 🔑 에러 원인WEB-INF 폴더에 있는 main.jsp 파일은 왜 볼 수 없었던 것일까?WEB-INF 폴더의 경우 브라우저에서 직접적으로 접근이 불가한 경로다.직접적으로 볼 수 없기 때문에 앵커 태그로 이동이 불가하며, Controller를 통해서만 이동을 해야 한다.http://localhost:8080/main.j.. 2024. 5. 16. [네트워크] localhost 와 127.0.0.1 ● localhost 로컬 디바이스에서 사용되는 도메인 이름● 127.0.0.1 현재 기기의 로컬 IP 주소를 의미거의 모든 컴퓨터 환경에서 자기 자신을 접근하는(loopback) 경우가 잦다.그리하여 OS 자체적으로 제공하고 , 항상 고정되어 있는 IP(127.0.0.1) 과 호스트네임(localhost)을 갖는다. 127.0.0.1은 예약된 IP 주소로 인터넷상에 일반 IP로는 쓰일 수 없는 주소이다.OS에서 가상으로 지원하며, 랜카드 등 디바이스 자체를 통과하지 않고 소프트웨어적으로 처리된다. 반면에 자신이 인터넷 상에 할당된 IP가 111.111.111.115인 경우자신의 IP로 직접 접근할 때는 랜카드 드라이버 등 디바이스 영역을 통과하여 처리되기 때문에localhost로 접근하는게 더.. 2024. 5. 14. 이전 1 ··· 3 4 5 6 7 8 9 ··· 19 다음 728x90 반응형
