반응형
최종 화면을 보여드리자면 비주얼 업데이트를 조금 진행했습니다.이렇게 만들게 되면 반응형을 따로 하지 않아도 바로 모바일 형식으로 볼 수 있는 장점이 있습니다.오늘은 네이게이션 설정과 메인 디자인을 하도록 하겠습니다.Navigation 영역 import styles from "./nav.module.css";import { Link } from "react-router-dom";function Nav() { return ( My Info 홈 ..
예전에 이미지를 한번 다룬적이 있는데요. https://frontdevpark.tistory.com/entry/HTML5-%EC%9D%B4%EB%AF%B8%EC%A7%80-%EB%A7%81%ED%81%AC-%EB%8B%A4%EB%A3%A8%EA%B8%B0img%ED%83%9C%EA%B7%B8-a%ED%83%9C%EA%B7%B8 HTML5 - 이미지, 링크 다루기(태그, 태그) 태그 이미지 안에 width와 height 넣을 수 있으나 css로 관리하는 게 더 좋습니다. HTML 삽입 미리보기할 수 없는 소스 태그 구글 태그는 현재창에서 바로 열리는 게 기본값입니다. target="_blank" : 새로 frontdevpark.tistory.com 이번에는 좀 더 CSS로 이미지 삽입 하는 스킬을 공유 하..
여러 홈페이지 사이트나 나도 많이 자주 쓰는 플러그인 Swiper.js WHY? 왜 써? 스와이퍼 같은 기능이 있으면 좋을 거 같은데?, 아 물품 같은 리스트를 있어 보이게 만들 수 없나? 또한 웹페이지에 적용시켜놓으면 굉장히 이쁩니다. 웹과 모바일 사진 아래를 통해 확인할 수 있습니다. CDN의 Swiper 사용 프로젝트에 Swiper 파일을 포함하지 않으려면 CDN에서 사용할 수 있습니다. 직접 다운받아서 사용할 수도 있습니다. https://www.jsdelivr.com/package/npm/swiper jsDelivr - A free, fast, and reliable CDN for JS and Open Source Optimized for JS and ESM delivery from npm an..
태그 태그 : 이미지, 동영상 등 멀티미디어를 넣을 때 태그 : 피겨 태그 안에 이미지 넣기 ~ 태그 : 피규어 태그 안에 이미지에 대한 제목글 넣기 태그 : 피규어 태그 안에 이미지에 대한 설명글 넣기 HTML 삽입 미리보기할 수 없는 소스
순서 있는 목록을 만드는 태그(ol : Ordered List) HTML 삽입 미리보기할 수 없는 소스 순서 없는 목록을 만드는 태그(ul : Unordered List) HTML 삽입 미리보기할 수 없는 소스
태그 이미지 안에 width와 height 넣을 수 있으나 css로 관리하는 게 더 좋습니다. HTML 삽입 미리보기할 수 없는 소스 태그 구글 태그는 현재창에서 바로 열리는 게 기본값입니다. target="_blank" : 새로운 탭에서 열리는 것 의미합니다. target="_self" : 기본값 현재창에서 열리는 걸 의미합니다. title : 마우스를 올렸을 때 툴팁 텍스트를 어떤 내용으로 출력할지 여부를 결정합니다. href : 하이퍼링크 줄임말을 의미하며 이동할 경로를 적으시면 됩니다. HTML 삽입 미리보기할 수 없는 소스