sm 기술 블로그

다음과 같이 사용하면 모달창을 만들 수 있다. 예를 들어 https://tailwindcomponents.com/component/modal-10 Modal | Modals 'Modal' tailwindcomponents.com 위 사이트에서 제공하는 모달을 가져와 프레임 워크안에 넣는다 해보자. 대화내용을 삭제하시겠습니까? 확인 취소 다음과 같이 작성이 가능하고 결과는 아래와 같다.

간단히 정의를 보면 absolute : left, top, right, bottom 값으로 전 화면을 아무런 제약 없이 쓸 수 있는 것 relative : absolute를 쓸 때 영역을 잡아주는 역할 fixed : 부모로 부터 독립되어 어느 것이든 사용이 가능하고 그 자리에 고정된다 다시 말해 absolute 는 자식 realtive는 부모라고 생각하면 된다. absolute는 아직 어려 이리저리 돌아다는 것을 좋아하고 realtive는 그런 아이의 공간을 제한 한다고 생각하면 된다. fiex는 상단 메뉴바와 같이 고정으로 사용하고 할 때 자주 사용 된다. - relative 문제점 영역을 제한해주는 것은 좋지만 모달창 구현 시 뒷 배경을 검게 칠했을 때 배경색이 적용되지 않는 문제점이 있다. 따라서 ..

SpringBoot API Docs : Rest API를 자동으로 관리해주며, 웹 UI툴을 제공한다. 1. 의존성 추가 implementation group: 'org.springdoc', name: 'springdoc-openapi-ui', version: '1.6.11' 2. yml 추가 springdoc: swagger-ui: path: shoppingMall.html version: v1 paths-to-match: - /** 위 과정을 진행하면 http://localhost:port/v3/api-docs 로 들어 갔을 때, JSON 형태의 데이터를 받는 것을 알 수 있다. http://localhost:port/swagger-ui/index.html 로 들어가면 위 JSON형태의 데이터를 웹 U..

원하는 결과물 성별부분은 select을 사용하였다. 처음 페이지에 들어갔을 때 DB에 저장된 select 값을 출력하고 싶다. th:if 이용 선택하세요. [[${user.gender}]] 남성 여성 밝히고 싶지 않음 if를 사용하여 값을 보여주자.