목록코딩/웹 프론트 (3)

노트

[React] 리액트 연습 - 페이징이 가능한 방명록 만들기1

. 리액트 강의를 간단하게 듣고 연습으로 페이징이 가능한 방명록을 만들어봤습니다. css는 따로 사용하지 않았습니다. 1. 입력 항목 : 제목, 내용, 작성자, 작성비밀번호 2. 출력 항목 : 제목, 내용, 작성자, 작성일시 3. 항목 삭제를 하기 위해서는 작성비밀번호를 입력해야함 4. 한 페이지에 10개씩 항목이 출력되며, 페이징 처리가 되어야 함 5. 입출력 데이터는 array형태로 state 에 저장 (Database 사용x) 저는 Visual Code를 사용했고, npm으로 create-react-app을 설치해줬다고 가정합니다.(yarn으로 설치도 가능) 먼저 개발을 진행할 폴더를 만들어줍니다. create-react-app 만들-폴더-이름 cd 만든폴더 npm start //또는 yarn st..
코딩/웹 프론트 2020. 7. 14. 17:13
Bootstrap nav tab 각 탭의 폭 동일하게 하기

. 이렇게 왼쪽 정렬된 탭을 . 이렇게 페이지 폭에 맞춰서 같은 사이즈로 만들고 싶을때 . . 1 2 3 4 5 첫줄의 ul태그의 클래스에 "nav-justified"를 추가해주면 된다. . .
코딩/웹 프론트 2020. 1. 30. 14:55
Bootstrap nav tab hover border color 지정

. . nav bar로 탭을 만들었는데 마우스를 올렸을 때 효과를 주려고 아래와 같이 css를 작성했는데 먹히지가 않아서 이것 저것 시도해봤다. . .col ul li a:hover { border: 1px solid #b4b4b5; border-bottom-color: #f4f3ef; } . . 일단 탭의 코드는 아래와 같다. . //html 1 2 3 1번탭 2번탭 3번탭 . . 태그로도 해보고 클래스로도 해봤지만 전혀 먹지를 않아서 고생중이었는데 실수로 :hover를 두번 쳤더니 먹혔다,, 왜이런걸까..? . . .col ul li a:hover:hover { border: 1px solid #b4b4b5; border-bottom-color: #f4f3ef; } . . . 먹혔음; . .
코딩/웹 프론트 2020. 1. 30. 13:52
Prev 1 Next