728x90 반응형 SMALL html3 Flexbox 📍Flexbox란뷰포트나 요소의 크기가 불명확하거나 동적으로 변할 때 효율적으로 요소를 배치,정렬,분산할 수 있는 법을 제공하는 레이아웃 방식 반응형 디자인을 구현하는데 강력한 도구 📍구성 flex container : flex item을 감싸고 있는 부모 요소 ( 전체에 관여) flex item : flex container 안에 있는 여러개의 자식 요소 (각각에 관여) 📍Flexbox 만들기정렬하려는 요소(flex item)의 부모 요소(flex container)에 display:flex속성을 지정하면 됨먼저 지정해줘야 다음 속성 적용 가능// 일반적으로 display: flex를 지정한다.flex-container {display: flex;} flex container: dis.. 2023. 10. 11. canvas 1) canvas width,height으로 속성 지정 inline-block 형태임 캔버스 태그 안에서 내용 그리려면 자식 노드를 추가 하는 것이 아니라 객체를 가져와서 함수 호출하여야 함 canvas api 사용하려면 캔버스 생성 + 렌더링 콘텍스트를 만들어야함 : 1-1) 사용법 ) 이후 js에서 다루기 const canvas = document.querySelector('canvas'); const ctx = canvas.getContext("2d") //ctx ->context 라는 의 1-2) 좌표 왼쪽 위 구석이 (0,0) 오른쪽으로 갈수록 x값 커짐 아래쪽으로 갈수록 y값 커짐 1-3) 각도 기준 : 가로축의 오른쪽 라디안 값 계산 radians = (Math.PI/180)*degree e.. 2023. 8. 3. 폼 삽입(form) 폼 삽입하기 (1) 태그 : 정보를 제출하기 위하여 어디서부터 어디까지가 양식인지 지정하는 역할 여러 폼 요소 [속성] Action 속성 : 양식 데이터를 처리할 서버 프로그램의 주소 Autocomplete : 자동완성 기능(기본으로 on -> 끌려면 off해야됨) (2) , Image : submit 버튼과 같은 기능(단지 이미지를 submit부분에 추가해서 이미지 누르면 폼 보내는 것) Button: 기본 버튼(submit/reset 버튼과 같은 기능 x, 형태만 삽입) File : 파일 첨부 할 수 있게 하는 기능 Hidden : 화면의 폼에는 보이지 않지만 사용자가 입력을 마치면 폼과 함께 서버로 전송되는 요소 (관리자가 알아야 하는 정보) 폼에서 사용하는 여러가지 태그 (1).. 2023. 8. 2. 이전 1 다음 728x90 반응형 LIST