Web

[Error] java.lang.NoSuchMethodError

자바빈 액션태그를 이용해서 자바 파일을 컴파일 후 클래스 파일이 생성되었는데도, 메서드를 찾을 수 없다는 에러가 뜬다. 1. 파일 경로가 올바른지 확인한다 2. java classpath 경로에 중복된 jar 파일이 있으면 제거한다

[Tomcat] 톰캣(tomcat) 설치

JSP를 실행할 수 있으려면 서버 프로그램이 필요한데, 그 중 대표적인 톰캣(tomcat)을 설치해보겠다. 톰캣은 다음 홈페이지에서 설치할 수 있다. tomcat.apache.org/ Apache Tomcat® - Welcome! The Apache Tomcat® software is an open source implementation of the Java Servlet, JavaServer Pages, Java Expression Language and Java WebSocket technologies. The Java Servlet, JavaServer Pages, Java Expression Language and Java WebSocket specifications ar tomcat.apache..

[CSS] Grid 함수, 단위

Grid Functions 그리드에서 사용하는 주요함수들 repeat : 행/열의 크기 정의 반복 .container{ grid-template-columns: 100px 100px 100px 100px 100px 100px 100px 100px 100px; grid-template-columns: repeat(9, 100px); } minmax : 행/열의 '최소/최대 크기' 정의 .container{ grid-template-columns: minmax(100px,1fr) minmax(200px, 1fr); /*첫번째열 최소최대, 두번째열 최소최대*/ } fit-content : 행/열의 크기를 그리드 아이템이 포함하는 콘텐츠 크기에 맞추되, 내용의 최대 크기를 설정 minmax(auto,max-co..

[CSS] Grid - items 속성

grid-row : grid-row-start와 grid-row-end의 단축 속성 grid-column : grid-column-start와 grid-column-end의 단축 속성 사용법 (grid-column도 똑같다) .item{ grid-row: / ; } .item{ grid-row: 2 / 5; grid-row: 2 / span 3; /* 윗줄과 동일 */ } .item{ grid-row: 1 / 4; grid-row: span3 / 4; /* 윗줄과 동일 */ } grid-area : grid-row-start와end, grid-column-start와 end의 단축속성 grid-template-areas가 참조할 영역 이름을 설정할 수 있다. *영역 이름을 설정할 경우 grid-row, ..

[CSS] Grid - Container 속성

Flexible Box -> 1차원 레이아웃 Grid: 2차원 (행과 열)의 레이아웃 시스템 제공 파이어폭스 브라우저를 사용해 테스트 추천. 개발자도구를 활용하면 그리드를 이해하기 좋음. Grid : 2차원 (행과 열)의 레이아웃 시스템 제공 Flex 같이 Container와 item으로 구분되어있다. *CSS Grid는 예전부터 핵(Hack)으로 불린 다양한 레이아웃 대체 방식들을 해결하기 위해 만들어진 특별한 CSS 모듈이다. display 값 의미 기본값 grid Block 특성의 Grid Container를 정의 inline-grid Inline 특성의 Grid Container를 정의 grid-template-rows : 행의 크기 정의 grid-template-columns : 열의 크기 정의..

[CSS] Flex - Items 속성

Flex Items 속성 의미 order Flex Item의 순서를 설정 flex flex-grow, flex-shiringk, flex-basis 의 단축 속성 flex-grow 증가 너비 비율 flex-shirink 감소 너비 비율 flex-basis (공간 배분 전)기본 너비 algin-self 교차 축에서 Item의 정렬 방법 order : item의 순서를 숫자 순으로 지정(음수 허용, 기본값 0) flex-grow : Item의 증가너비를 숫자-비율로 설정(기본값 0) ex) 1:2:3 => 100px, 200px, 100px *item이 가변너비가 아니거나, 0일경우 효과 없음 *요소의 고정너비가 적용되어있는경우에는 완벽한 비율로 설정되지는 않음 예제( 하나는 고정하고 다른 하나는 유연하게 ..

[CSS] Flex - Container 속성

before : flat, table tag, display: inline-block 수평 정렬 => 대체방법에 가까움. 완벽하지 x inline-block 사용 예제 item 자체가 inline 화 되었기 때문에 에서 사이의 엔터키 친게 띄워쓰기로 인식되어서, 이렇게 item 들 사이에 간격이 생긴다 부모요소에서 font-size를 0으로 설정해 간격을 없애고, item에서 원하는 font-size를 재설정해야하는 번거로움이 있다. float 사용예제 ( 수평정렬에 특화된 속성은 아니라 일종의 대체제 였다) .clearfix::after{ content: ""; display: block; clear: both; } .container{ border: 2px solid red; } .container ..