반응형

bootstrap4 3

Bootstrap 4 달력 : datetimepicker (Bootstrap 3버전 업그레이드 버전) 인기 달력

Bootstrap 3에서 가장 인기 있는 달력이라면, 단연 Eonasdan 라이브러리 달력을 최고로 손꼽습니다. 해당 Bootstrap 3 Date/Time Picker v4.17.47까지 나와 있습니다. (01/14/2020) 진행 중인 프로젝트에 Bootstrap 4를 사용하게 되었는데, 과거 Eonasdan Date Picker가 Bootstrap 4를 지원을 하지 않게 되어서, Bootstrap 4에 지원되는 Date Picker가 필요하게 되었답니다. Bootstrap 4에 완전하게 지원되는 Date Picker인 Tempus Dominus를 찾게 되었죠. Tempus Dominus은 Eonasdan 라이브러리의 업그레이드된 버전이죠. Tempus Dominus 라이브러리: https://tem..

Web/Bootstrap 2020.01.15

Bootstrap 4에서 svg 아이콘 사용하기

Bootstrap 4에서 svg 아이콘을 만들수 있습니다. Bytesize Icons https://github.com/danklammer/bytesize-icons/blob/master/README.md svg 아이콘들은 백터 형태이기 때문에 사이즈가 변화되어도, 이미지 처럼 깨짐이 없습니다. 카메라 아이콘 SVG 태그 여기서 width="20" height="20"으로 주면, 사이즈가 줄게 됩니다. stroke-width="3"를 주면 더 두꺼워 집니다. [ 모서리 부분을 값을 선택 ] Style stroke-linejoin stroke-linecap Round round round Bevel bevel butt Miter miter butt [ 두께를 다르게 하는 형태 ] Weight stroke-..

Web/Bootstrap 2018.12.05

Bootstrap 4 Display 유틸리티 - table columns 을 hide 처리하기

Bootstrap 4을 사용을 시도해 보고 있는데, Utilites > Dispaly 를 이용해서, responsive display의 hide 처리를 할 수 있는 propety가 있어서, 태그에 ,에 .d-lg-block을 사용해 보려고 했답니다. [ .d-none .d-lg-block 을 사용 했을때, 테이블 깨지는 현상 발생 ] 테이블에 사용할때면, 이상하게 컬럼이 밀리고 깨는지는 형상이 났습니다. (원인은, .d-lg-block을 줬던 부분의 객체가 block형태로 변화되어서, 라인전체를 차지하려고 하기에 발생하는 현상입니다.) 알고 보니. d-lg-block은 block/inline 타입인 , 과 같은 요소에서만 사용을 하였더군요. (참고: https://getbootstrap.com/docs/..

Web/Bootstrap 2018.11.30
1
반응형