본문 바로가기

전체 글402

조건문 기본형 if (조건) { 참일때 실행할 코드 } else { 거짓일 때 실행할 코드 } 출처 : 스파르타코딩클럽 Programing/JavaScript 2024. 2. 26.
변수 / 자료형 변수 변수 : 속성을 담는 그릇 결과 화면(콘솔창)에서는 대한민국 이라고 출력된다. 자료형 리스트 / 딕셔너리 리스트 a라는 변수에 사과 뿐만 아니라 수백개의 과일을 담고자 할 때, 이런 상황에서 쓰인다. let fruit = ['사과', '배', '수박']; console.log(a) // 사과만 꺼내고 싶을 때, 프로그래밍 언어는 0부터 시작 // console.log(a[0]) 딕셔너리 사과, 배, 수박과 같이 같은 종류이지만 완전히 다른 정보가 아니라, Bob이라는 사람의 이름, 나이, 키와 같이 한 정보에 종속되는 여러가지 정보를 사전처럼 하나의 그릇에 담고자 할 때 사용한다. let person = {'name':'bob', 'age':30, 'height':180} console.log(pe.. Programing/JavaScript 2024. 2. 26.
목록 스타일 (list-style-type) ul, ol 등의 목록을 작성할 때 ul(Unordered List)를 제외하고 ol(Ordered List)를 작성할 때 하위의 의 글머리기호의 서식을 정할 수 있는 속성이다. 속성값 disc : 채운 원 모양 // ● circle : 빈 원 모양 // ○ square : 채운 사각형 모양 // ■ decimal : 1부터 시작하는 10진수 // 1, 2, 3 decimal-leading-zero : 앞에 0이 붙는 10진수 // 01, 02 lower-roman : 로마 숫자 소문자 / i, ii, iii upper-roman : 로마 숫자 대문자 / I, II, III lower-alpha 또는 lower-latin : 알파벳 소문자 // a, b, c upper-alpha 또는 upper-alph.. Programing/CSS 2024. 2. 26.
글자 간격 조절 (letter-spacing, word-spacing) 두 스타일 속성의 차이 letter-spacing : 글자와 글자 사이를 조절 (자간) word-spacing : 단어와 단어 사이를 조절 보통은 letter-spacing으로 자간을 조절한다. letter-spacing의 속성값 px, em 같은 단위 또는 % 자간조절테스트 출처 : 웹 표준의 정석 (고경희 저) Programing/CSS 2024. 2. 26.
텍스트의 대소문자를 변환 (text-transform) 한글에는 적용 안 된다. 영어를 대소문자 또는 전각 문자로 변환한다. 속성값 none : 변환하지 않는다. 기본값. capitalize : 첫 번째 글자를 대문자로 변환 uppercase : 모든 글자를 대문자로 변환 lowercase : 모든 글자를 소문자로 변환 full-width : 가능한 모든 문자를 전각 문자로 변환 출처 : 웹 표준의 정석 (고경희 저) Programing/CSS 2024. 2. 26.
2024년 내일배움캠프 React_5기 나는 2024년 2월 19일부터 스파르타코딩클럽의 내일배움캠프 과정에 합류하였고, 웹 프론트 엔지니어 양성 과정 - React 5기에 참여하게 되었다. 이 포스트는 스파르타코딩클럽에서 마련해 준 질문지를 정리하여 계속해서 나만의 답변으로 업데이트 해 나갈 예정이다. 스타터 노트 1. 내가 React 트랙에 참여한 계기는 무엇인가요? 나는 문과 출신에 10여년 간 해왔던 일도 컴퓨터나 개발과는 전혀 상관없는 지극히 문과적인 일을 해왔다. 따라서 처음에는 React 트랙이라는 문구가 눈에 들어오지도 않았고 무슨 의미인지 교육생 모집 상세 커리큘럼을 보아도 그저 스쳐지나가는 정보였다. 따라서 React 과정이라는 것을 빼놓고 내가 웹 프론트 엔지니어 양성 과정에 신청하게 된 이유에 대해서 설명해야겠다. 이전 .. Programing/TIL 2024. 2. 26.
텍스트에 그림자 효과 주기 (text-shadow) 입체감 있는 글자를 표현한다. 속성값 none : 그림자를 없앤다 (지정하지 않았을 때 기본값임.) 가로 거리 : 필수 속성. 양수는 글자의 오른쪽, 음수는 글자의 왼쪽에 그림자를 만든다. 세로 거리 : 필수 속성. 양수는 글자의 아래쪽, 음수는 글자의 위쪽에 그림자를 만든다. 번짐 정도 : 기본값은 0. 양수는 모든 방향으로 번짐, 음수는 모든 방향으로 축소. 색상 : 기본값은 현재 글자 색. ㅎㅎ ㅎㅎ ㅎㅎ 출처 : 웹 표준의 정석 (고경희 저) Programing/CSS 2024. 2. 26.
텍스트 줄 표시/미표시 (text-decoration) 밑줄을 긋거나, 취소선을 표시할 때 사용한다. 하이퍼링크를 생성하면 밑줄이 자동으로 생기는데 이를 없앨 때도 사용한다. 속성값 none : 밑줄 미표시 underline : 밑줄 표시 overline : 윗줄 표시 line-through : 취소선 표시 취소선입니다. 또는 p { text-decoration: line-through; } 출처 : 웹 표준의 정석 (고경희 저) Programing/CSS 2024. 2. 26.
텍스트 정렬 스타일 속성(text-align, text-height) 텍스트 정렬(text-align) 속성값 (지정하지 않으면 왼쪽 정렬이 default) start : 현재 텍스트 줄의 시작 위치에 맞추어 문단 정렬 end : 현재 텍스트 줄의 끝 위치에 맞추어 문단 정렬 left : 왼쪽에 맞추어 문단 정렬 right : 오른쪽에 맞추어 문단 정렬 center : 가운데에 맞추어 문단 정렬 justify : 양쪽에 맞추어 문단 정렬 match-parent : 부모 요소를 따라 문단 정렬 .container { text-align: center; } 줄 간격 조절 (line-height) 속성값 0px; : 줄 간격을 픽셀로 지정 2.0; : 해당 폰트의 배율. 이 경우 2.0배 200% : 해당 폰트의 배율. 이 경우 200%이므로 2.0배 보통 줄 간격은 글자 크기.. Programing/CSS 2024. 2. 26.
텍스트 색상 스타일 속성(color) 글자색 (color) color: 색상값을 표현하는 방법 16진수 (hex) # 기호 뒤에 6자리 숫자로 표현 #ffff00 rgb, rgba rgba는 red, green, blue 값 뒤에 alpha 불투명도를 나타내는 값을 표현. a 값으로는 0~1 표현 가능. 1이 완전 불투명 0.9, 0.8 등으로 표현 가능 h1 { color: rgba(0, 0, 255, 0.5); } 색상 이름으로 지정 (red, green 등) https://www.w3big.com/ko/tags/html-colorname.html#gsc.tab=0 참고 HTML 색상 보여주는 사이트 https://htmlcolorcodes.com/ HTML Color Codes Easily find HTML color codes for.. Programing/CSS 2024. 2. 26.