어제 오늘 내일

VSCode의 기본 탭 간격은 4입니다. 즉, 탭을 입력하면, 4칸의 공백이 생깁니다. 이번에는, 탭 간격을 변경하는 방법을 정리하였습니다. 1. Setting 메뉴 선택 2. 'tab size'를 검색합니다. 3. Editor:Tab Size 영역의 숫자를 원하는 탭간격으로 변경합니다. 이제부터는 탭을 입력하면 2칸씩 공백이 생기게 됩니다.

pwd 리눅스에서 현재 위치한 폴더를 확인하기 위해서 다음 명령어를 사용할 수 있습니다. pwd pwd는 Present Working Directory의 약자입니다. pwd 명령어를 입력하면 위와 같이 현재 위치한 경로를 보여줍니다.

원노트를 사용해서 필기를 하다보면, 첫글자가 소문자일 경우, 자동으로 대문자로 변환되어서 불편할 때가 있습니다. 이런 경우 다음과 같이 설정하면 첫글자가 소문자일 경우, 자동으로 대문자로 변경되는 자동변환 기능을 해제할 수 있습니다. 1. 파일 메뉴 선택 2. [옵션] 메뉴 선택 3. [언어 교정] - [자동 고침 옵션] 선택 4. '문장의 첫 글자를 대문자로[the -> The]' 항목 선택 해제 이렇게 설정을 마치면, 이제부터는 노트에 소문자로 시작하는 단어를 입력해도 자동으로 대문자로 변환되지 않습니다.

CSS에서 태그를 사용하여 목록을 만들면 목록 앞에 점 또는 숫자가 보여집니다. ( 태그와 사용하면 점, 태그와 함께 사용하면 숫자) 이 점 또는 숫자의 색깔을 바꾸기 위해서 CSS의 ::marker 가상 요소를 사용할 수 있습니다. ::marker ::marker는 리스트 아이템 앞에 오는 마커를 선택하는 가상 요소입니다. 리스트의 점 색깔 바꾸기 하나 둘 셋 li::marker { color: red; } li::marker { color: red; } ::marker 가상 요소로 li의 마커를 선택하여 마커의 색깔을 변경하였습니다. 리스트의 점 대신 하트로 바꾸기 하나 둘 셋 li::marker { content: '❤ '; color: pink; } li::marker { ... } ::marke..

텍스트를 흐리게 블러 처리하기 위해서 다음 2가지 방법을 사용할 수 있습니다. text-shadow filter: blur() text-shadow CSS의 text-shadow 속성은 텍스트에 그림자를 만들어줍니다. text-shadow에 관한 자세한 설명은 지난 포스팅을 참조하세요. [HTML/CSS] 텍스트에 그림자 넣기 (text-shadow) text-shadow text-shadow .ex01 { background: blue; text-shadow: 0px 0px 10px white; color: transparent; } .ex02 { text-shadow: 0px 0px 10px black; color: transparent; } div { font-size: 30px; font-weig..

CSS에서 텍스트에 그림자 효과를 주기 위해서는 text-shadow 속성을 사용합니다. text-shadow text-shadow: 3px 4px 5px red; 속성값 offset-x, offset-y (필수) 그림자의 위치를 지정합니다. offset-x : 양수이면 글자의 오른쪽에, 음수이면 글자의 왼쪽에 그림자가 나타납니다. offset-y : 양수이면 글자의 아래쪽에, 음수이면 글자의 위쪽에 그림자가 나타납니다. blur-radius 숫자가 커질수록, 그림자가 흐릿해집니다. color 그림자의 색깔을 지정합니다. 텍스트에 그림자 효과 주기 예제 ex01 ex02 ex03 .ex01 { text-shadow: 5px 5px gray; } .ex02 { text-shadow: 5px 5px 4px ..

이전 포스팅에서는 CSS의 box-shadow 속성을 사용하여 박스에 그림자를 만들어주는 방법을 알아보았습니다. [HTML/CSS] div 박스에 그림자 만들기(box-shadow) [HTML/CSS] div 박스 그림자 한쪽만 만들기(위, 아래, 오른쪽, 왼쪽) 이번에는 box-shadow로 생성한 그림자에 투명도를 지정해 주는 방법을 알아보려고 합니다. 투명도 설정하기 box-shadow 속성에는, 투명도를 설정할 수 있는 항목이 따로 없습니다. 그래서, 그림자의 투명도를 지정하기 위해서는 color 항목을 rgba형식을 사용해서 표현해야 합니다. color를 표현하는 방법 중 하나인 rgba는 'red, green, blue, alpha' 이렇게 4가지 값을 지정할 수 있는데, 이 중, alpha는..

지난 번에는 CSS의 box-shadow 속성을 사용하여 그림자를 만드는 방법을 알아보았습니다. [HTML/CSS] div 박스에 그림자 만들기(box-shadow) [HTML/CSS] div 박스에 그림자 만들기(box-shadow) 박스에 그림자를 그리기 위해서는 CSS의 box-shadow 속성을 사용합니다. box-shadow 이 속성은 CSS 요소에 그림자를 추가해줍니다. box-shadow : 5px 5px 5px 5px red inset; 허용 값 offset-x, offset-y 그림자의 위치를 hianna.tistory.com 이번에는 이것을 응용하여, 박스의 위쪽, 아래쪽, 오른쪽, 왼쪽에만 그림자를 만들어보겠습니다. box-shadow 먼저 잠깐, box-shadow에 지정할 수 있는..

박스에 그림자를 그리기 위해서는 CSS의 box-shadow 속성을 사용합니다. box-shadow 이 속성은 CSS 요소에 그림자를 추가해줍니다. box-shadow : 5px 5px 5px 5px red inset; 허용 값 offset-x, offset-y 그림자의 위치를 지정합니다. offset-x : 양수를 입력하면 그림자가 오른쪽으로, 음수를 입력하면 그림자가 왼쪽으로 만들어집니다. offset-y : 양수를 입력하면 그림자가 아래쪽으로, 음수를 입력하면 그립자가 위쪽으로 만들어집니다. blur-radius 숫자가 커질수록, 그림자가 블러 처리되어 흐려집니다. spread-radius 숫자가 커질수록, 그림자의 크기가 커집니다. color 그림자의 색깔을 지정할 수 있습니다. inset ins..

, , 태그를 사용하여 생성된 목록 앞에는 목록을 구분하는 점, 숫자 등이 표시됩니다. 이 때, 앞에 붙는 점을 없애는 방법입니다. list-style-type 또는 list-style 목록 사과 바나나 오렌지 점 없는 목록 사과 바나나 오렌지 .no_dot { list-style-type: none; } list-style-type: none; 리스트 앞에 붙은 점을 제거 하기 위해서 list-style-type의 값을 'none'으로 설정하였습니다. list-style-type 대신 list-style 속성을 사용해도 됩니다. list-style-type: none; list-style: none; (list-style 속성은, list-style-image, list-style-position, l..