본문 바로가기

분류 전체보기811

[정보] RGB 값<->HEX값으로 변환 RGB 값HEX값으로 변환 RGB 값을 HEX로 변환하거나 반대로 HEX값을 RGB값으로 변환하기 위해 구글링을 하는 경우가 가끔 있어서 정리합니다. RGBHEX 변환 및 Color Picker에서 값 확인이 필요한 경우 아래의 사이트를 참조하세요. 참조 사이트: RGB↔HEX 변환하기 https://www.toolo.kr/color-convert/ 2022. 9. 27.
[CSS] z-index position 속성 사용 z-index position 속성 position 속성을 이용하면 요소를 겹치게 놓을 수 있습니다. 이때 요소들의 수직 위치(z축)를 z-index 속성으로 정합니다. 정수 값이 클 수록 위로 올라오고, 숫자가 작을 수록 아래로 내려갑니다. 참고 글: CSS / z-index / 요소의 수직 위치 정하는 속성 https://www.codingfactory.net/10878 2022. 9. 26.
[Javascript] 삼항 연산자 사용 방법 Javascript 삼항 연산자 기본적인 사용법은 아래와 같습니다. const value = data ? '참일 경우 값' : '거짓일 경우 값' 아래 처럼 축약으로도 사용할 수 있습니다. const value = a?.b?.c ? '참일 경우 값' : '거짓일 경우 값' ※ a.b.c의 값을 체크하기 전 a와 b에 값이 존재하는 지를 먼저 확인할 수 있습니다. 추가로 ?? 를 사용하여 undefined와 null 을 체크할 수 있습니다. const value = data ?? '' // data 가 undefined 또는 null이면 ''로 대치함 2022. 9. 22.
[정보] 손흥민 '13분 만에 해트트릭' 골 모음 영상 손흥민 '13분 만에 해트트릭' 손흥민은 이날 영국 런던의 토트넘 홋스퍼 스타디움에서 열린 레스터시티와 2022-2023 잉글랜드 프리미어리그 8라운드 홈 경기를 벤치에서 시작했습니다. 이후 후반 14분 히샤를리송 대신 투입된 손흥민은 후반 28분과 39분, 41분 연달아 득점포를 가동하며 토트넘의 6-2 대승을 이끌었습니다. 앞서 이번 시즌 프리미어리그 6경기에 유럽축구연맹(UEFA) 챔피언스리그 2경기를 더한 공식전 8경기에서 골을 넣지 못했던 손흥민은 이날에서야 올 시즌 첫 골 맛을 봤습니다. 리그에서는 5월 노리치시티와의 2021-2022시즌 리그 최종전 이후 약 4개월 만에 득점포를 가동했습니다. 또한 해트트릭까지 달성하며 그동안의 부진 우려를 말끔히 씻어냈습니다. 손흥민은 경기 후 인터뷰에서 .. 2022. 9. 15.
[CSS] 무료 icon 이미지 다운로드 사이트 무료 icon 이미지 다운로드 사이트 ICONS https://icons8.com/icons 2022. 9. 7.
[Javascript] 랜덤(Random) 숫자 가져오기 랜덤(Random) 숫자 가져오기 최소부터 최대까지 숫자를 랜덤하게 가져오는 경우 아래의 공식? 처럼 하면 됩니다. function generateRandom(min, max) { return Math.floor((Math.random() * (max - min + 1)) + min); } ※ 소수점으로 반환이 되기 때문에 내림 함수인 Math.floor를 사용합니다. 2022. 9. 6.
[정보] Intellij 새창 띄우기(시작 시 프로젝트 다시 열기) Intellij 새창 띄우기(시작 시 프로젝트 다시 열기) 파일 - 설정 - 모양 및 동작 - 시스템 설정으로 이동 후 시작 시 프로젝트 다시 열기 설정을 새 창으로 수정하면 됩니다. 2022. 9. 2.
[CSS] .svg(Scalabe Vector Graphic) Image SVG(Scalabe Vector Graphic) : SVG 이미지는 XML 문법을 기본으로 로고나 아이콘, 그래프 등 널리 사용하는 이미지 파일입니다. SVG 이미지는 크기를 줄이거나 늘리더라도 화질에 영향을 받지 않습니다. 원하는 색상으로 자유롭게 적용가능합니다. 참고 글: [CSS] - SVG 이미지 사용 방법[CSS] - SVG 이미지 사용 방법 https://mingoogle.tistory.com/9 2022. 9. 1.
[CSS] position(static, relative, absolute, fixed) 속성 정리 position(static, relative, absolute, fixed) : 레이아웃을 배치하거나, 객체를 위치 시킬 때 사용되는 속성입니다. static(기본값): 객체에 대한 위치를 지정하지 않을 때 사용됩니다. relative : static이 가지고 있는 위치를 시작점으로 위치를 지정할 수 있습니다. absolute : 가장 가까운 상위 요소를 기준으로 원래 위치와 상관없이 위치를 지정할 수 있습니다. fixed : 브라우저 화면의 상대 위치를 기준으로 원래 위치와 상관없이 위치를 지정할 수 있습니다. 상위 요소에 영향을 받지 않기 때문에 화면이 바뀌더라도 고정된 위치에 지정할 수 있습니다. 참고 글: [css] position (static, relative, absolute, fixed).. 2022. 9. 1.
[CSS] display 속성 정리 display : 요소의 크기를 결정하는 속성입니다. 🟦 display 속성 display: none : 화면에 보이지 않으며 영역도 차지하지 않습니다. display: block : width가 100%의 영역으로 설정이 됩니다. (div 기본값과 동일) - 가로 한 줄 모두 차지 display: inline : 컨텐츠의 크기만큼의 영역만 설정이 됩니다.(width를 변경해도 영역이 변하지 않음) display: inline-block; : inline과 block의 특성이 모두 있습니다. inline의 속성이 있지만, width로 크기를 설정할 수 있습니다. 참고 글: [CSS] display란? / display 속성 / display 종류 https://programming119.tistory.c.. 2022. 8. 25.
[정보] 한국인이 가장 많이 틀리는 맞춤법 한국인이 가장 많이 틀리는 맞춤법 이금희 아나운서가 알려주는 한국인이 가장 많이 틀리는 맞춤법입니다. 오늘 대/데 맞춤법을 알게 되었네요. ^^ 2022. 8. 23.
[CSS] Input or textarea에 안내문구 추가 - placeholder 색상, 폰트 변경 placeholder는 HTML5에서 새로 나온 속성(attribute)으로 input이나 textarea에 안내문을 추가합니다. 기본 색상은 회색으로 배경색이 어두운 색이거나 화려한 색일 경우 ::placeholder 선택자로 색상 및 폰트를 변경할 수 있습니다. placeholder를 사용하여 안내문구를 추가합니다. ::placeholder 선택자(Selecter)로 글자 색과 모양을 변경합니다. input::placeholder { color: red; font-style: italic; } textarea::placeholder { color: blue; font-weight: bold; } 만약 적용이 되지 않는 브라우져가 있다면 아래와 같이 수정하면 됩니다. // Chrome/Opera/Saf.. 2022. 8. 19.
728x90