전체406 정방향 세로배치, 역방향 세로배치 - flex-direction DOCTYPE html> Document /* 부모 속성에 사용하는 flexbox 속성 : flex-direction: column | column-reverse */ .parent { border: 5px solid green; height: 500px; display: flex; /* column : 정방향 배치 세로배치 */ flex-direction: column; /* column-reverse : 역방향 배치 세로배치 */ /* flex-direction: column-reverse; */ } .parent div { width: 300px; height: 200px; color: #ffffff; text-align: center; font-size: 30px; margin: 5px; /* b.. 개발일지/HTML 2022. 11. 7. 정방향 가로배치, 역방향 가로배치 - flex-direction DOCTYPE html> Document /* 부모 속성에 사용하는 flexbox 속성 : flex-direction: row | row-reverse */ .parent { border: 5px solid green; height: 500px; display: flex; flex-direction: row; /* row : 정방향 배치 가로배치 */ flex-direction: row-reverse; /* row-reverse : 역방향 배치 가로배치 */ } .parent div { width: 300px; height: 200px; color: #ffffff; text-align: center; font-size: 30px; margin: 5px; /* background-color: blue; *.. 개발일지/HTML 2022. 11. 7. justify-content 와 align-items 차이점 부모태그에 display : flex, justify-content parent에 높이를 300을 주었다. 하지만 자식 태그중에서 child2에는 높이를 주지 않았다 이럴경우에는 부모인 parent 높이를 따라간다 DOCTYPE html> Document .parent { border: 5px solid green; height: 300px; display: flex; justify-content: space-around; } .parent div { width: 300px; color: #ffffff; text-align: center; font-size: 30px; margin: 5px; background-color: aqua; } .child1 { height: 100px; } .child2 {}.. 개발일지/HTML 2022. 11. 7. Collections, List, Set, Map List에서 값 가져오기 List list = [1,2,3,4,5]; // 리스트만 대괄호 사용한다. print(list[0]); List에서 forEach활용해 모든 값 가져오기 list.forEach((element) { print("요소 확인 : ${element.runtimeType}"); }); List에서 마지막 값 삭제하기(removeLast) // 마지막 요소 삭제 list.removeLast(); print(list); List 전체 삭제하기(clear) // 전체 요소 삭제 list.clear(); print(list); Collection (null 허용 x) 컬렉션 내 데이터들 나열된 상태를 명시해주는 연산자로, 컬렉션에 다른 컬렉션 데이터를 삽입할 때 사용 var list3 = [.. 개발일지/Dart 2022. 11. 7. # 15 문자열을 소문자로 변환(LOWER) 문자열을 소문자로 변환(LOWER) SELECT LOWER("SQL Tutorial is FUN!") AS "문자열을 소문자 변환"; 개발일지/MySQL 문제모음 2022. 11. 7. # 14 문자열 에서 조건을 검색하고 위치를 반환(LOCATE) 문자열 에서 조건을 검색하고 위치를 반환(LOCATE) SELECT LOCATE("4", "MY SQL4") AS "조건 4의값 인덱스 위치"; 개발일지/MySQL 문제모음 2022. 11. 7. # 13 문자열의 길이를 바이트 단위로 반환(LENGTH) 문자열의 길이를 바이트 단위로 반환(LENGTH) SELECT LENGTH("sql한글") AS "문자열의 길이를 바이트단위로 반환 영어 : 1바이트, 한글 : 2바이트, 공백 1바이트"; 개발일지/MySQL 문제모음 2022. 11. 7. flex란 부모 요소인 div.container를 Flex Container(플렉스 컨테이너)라고 부르고, 자식 요소인 div.item들을 Flex Item(플렉스 아이템)이라고 부른다. “컨테이너가 Flex의 영향을 받는 전체 공간이고, 설정된 속성에 따라 각각의 아이템들이 어떤 형태로 배치되는 것”이라고 생각하면 된다. div 개발일지/HTML 2022. 11. 7. # 12 왼쪽부터 문자3글자 추출하기(LEFT) 왼쪽부터 문자3글자 추출하기(LEFT) SELECT LEFT("SQL Tutorial", 3) AS "왼쪽부터 문자3글자 추출하기"; 개발일지/MySQL 문제모음 2022. 11. 7. # 11 문자열을 소문자로 변환(LCASE) 문자열을 소문자로 변환(LCASE) SELECT LCASE("SQL Tutorial is FUN!") as "문자열을 소문자로 변환"; 개발일지/MySQL 문제모음 2022. 11. 7. do while, break, continue, Switch and Case, do - while문 // do - while var input = 0; var sum = 0; do { input++; sum += input; if (input >= 10) { input = 0; } print("sum: ${sum}"); } while (input != 0); break // break문 사용하기 for(var i = 0; i < 10; i++){ if(i == 7){ break; } print("i : ${i}"); } continue // continue 사용하기 for(var i = 0; i < 10; i++){ if(i == 7){ continue; } print("i : ${i}"); } Switch and Case // Switch and Cased var command .. 개발일지/Dart 2022. 11. 6. for문, forEach문, StringBuffer, whil for문 var strs = ['A','B','C']; // for문 for(var i = 0; i < strs.length; i++){ print(strs[i]); } print("------------"); forEach문 - 1 // forEach문 // var strs = ['A','B','C']; for(var el in strs){ print("foreach : ${el}"); } print("------------"); forEach문 - 2 var coll = [1,2,3]; print("====================="); coll.forEach(print); print("====================="); coll.forEach((e) {print(e); }); Stri.. 개발일지/Dart 2022. 11. 6. 이전 1 ··· 19 20 21 22 23 24 25 ··· 34 다음