본문 바로가기

개발자 꿈나무67

margin: 0 auto; 가운데 정렬이 되지 않을 때 가운데 정렬을 하는 방법은 여러가지가 있는데 나는 그 중에서도 text-align:center; 와 margin: 0 auto;를 가장 많이 사용하는 편이다. 그런데 간혹 margin:0 auto;를 적용해도 가운데 정렬이 되지 않을 때가 있다. 이러한 상황에서 체크해 볼 수 있는 세가지 방법에 대해서 소개하도록 하겠다. margin: 0 auto; 가운데 정렬이 되지 않을 때 해결방법 1. 가장 첫번째로 해야 할 일은 선언이 제대로 되었는지 확인해보아야 한다. 2. auto는 자동으로 사이즈를 설정해주는 것이다. 그러므로 가로폭의 사이즈를 정확하게 인식할 수 있어야 정렬이 가능하다. margin: 0 auto; 가 반응하지 않을 때에는 해당 영역의 가로 사이즈가 제대로 설정되어 있는지 확인해보고, 만약.. 2021. 8. 2.
CSS로 색상 표현하기(HEX, RGB, 색 이름) html 파일에 사용된 텍스트나 div 배경 등에 색상을 사용할 때는 CSS를 이용하면 된다. CSS에서 색상을 표현하는 방법 세가지를 포스팅으로 정리하려고 한다. 색 이름 사용하기 우리가 사용하는 색상 이름을 바로 입력하여 사용이 가능하다. p { color: red; background-color: white; } CSS에서는 140가지의 색상을 이름으로 지원한다고 한다. 아래 url을 클릭하면 지원하는 색상표를 확인할 수 있다. 그러나 이 방법은 black, white가 아닌 이상 색상을 세밀하게 원하는 대로 조절할 수 없어서 디자이너들은 거의 사용하지 않는다. 이를 보완하여 더 다채로운 색상을 표현하는 방법은 HEX, RGB를 사용하는 것이다. https://www.w3schools.com/css.. 2021. 7. 22.
자바스크립트 함수 선언과 호출 변수가 값을 저장하는 기능을 한다면, 함수는 명령을 저장하는 기능을 한다고 생각하면 된다. 파이썬에서 함수를 선언할 때는 def를 사용했는데 자바스크립트에서는 function을 사용한다. (앍 헷갈려...) 자바스크립트 함수를 선언하고 호출하는 방법에 대해서 정리하도록 하겠다. 함수 선언 함수 선언의 구조는 아래와 같다. function 함수명() { 명령; 명령; }; function 뒤에 원하는 함수명을 입력한 뒤에 소괄호, 중괄호를 순서대로 써주면 된다. 중괄호 안에는 명령어들을 입력하는데 보통 한 줄에 명령 한 개를 입력한다. // 함수 선언 function hello() { console.log('Hello, world!'); console.log('Nice to meet you.'); }; 함.. 2021. 7. 16.
클래스(class)와 아이디(id)의 차이점 html의 특정 요소에만 다른 효과를 주고 싶을 때, 해당 요소에 클래스명 또는 아이디값을 할당하여 처리가 가능하다. 클래스(class)와 아이디(id)는 얼핏 보기엔 똑같은 기능을 하는 것 같지만, 알고 보면 이 둘은 큰 차이점을 가지고 있다. 이름을 불러오는 방식 클래스를 불러올 때는 클래스명 앞에 마침표(.)를 찍어준다. 아이디를 불러올 때는 아이디값 앞에 샵(#) 표시를 해준다. 아래는 아이디값과 클래스명을 모두 가진 태그가 있고, 이것을 css를 이용하여 꾸며준 예시이다. 김영희 중복 사용 여부 클래스는 중복 사용이 가능하여, 동일한 클래스명을 페이지의 여러 곳에 사용해도 무방하다. 그러나 아이디는 중복으로 사용할 수 없다. 한 개의 아이디는 페이지에서 딱 한번만 사용해야 한다. 김영희 박철수 .. 2021. 7. 15.
자바스크립트 좋은 변수명 짓기 & 스타일 가이드 자바스크립트 코드를 쓰고 변수명을 지을 때에 도움이 될 만한 몇가지 팁을 공유하려고 한다. - 자바스크립트 식별자는 알파벳 대소문자, 밑줄(_), 달러기호($), 숫자를 사용한다. - 식별자는 알파벳 대소문자를 구별하며, 첫글자로 숫자는 사용할 수 없다. - 예약어(let, if, for 등)는 변수명으로 사용할 수 없다. - 의미없는 변수명(a, b, c 등)은 되도록 사용하지 않도록 한다. - 변수 이름은 첫번째 글자는 소문자, 띄어쓰기가 있는 각 단어의 첫 문자는 대문자로 표기(camelCase)한다. - 코드 들여쓰기는 2칸 공백을 사용한다. 다른 건 다 그렇다치고 파이썬 기초 강의를 듣고 나니 변수 표기법과 들여쓰기가 파이썬과 달라서 혼란스러워 하는 중이다. 코드 들여쓰기의 경우 파이썬은 4칸 .. 2021. 7. 14.
자바스크립트 변수 var, let, const 차이 자바스크립트 강의를 들으면서 궁금했던 점이 한가지 있었다. 나는 분명히 예전에 변수 선언을 var로 배웠는데 강의에서는 let을 사용한다는 거였다. 그래서 검색해보니 변수 선언에는 var, let, const 세가지를 사용할 수 있으며, 각각 차이점이 있었다. 이 포스팅에서는 그 차이점에 대해서 정리해두려고 한다. var 예전에는 자바스크립트의 변수 선언이 var로만 가능했었다. var로 변수 선언을 했을 때의 가장 큰 특징은 중복 선언이 가능하다는 점인 것 같다. var a = 100; console.log(a) // 결과값 100 var a = 200; console.log(a) // 결과값 200 var a = 300; console.log(a) // 결과값 300 var를 사용하면 위와 같이 중복.. 2021. 7. 14.
자바스크립트 변수 선언하기 자바스크립트에서도 반복되는 데이터들을 변수 선언해서 좀 더 편리하게 관리할 수 있다. 변수 선언하는 방법에 대해서 소개하려고 한다. 과일가게에서 사과는 1,000원 / 망고는 1,500원 / 멜론은 2,500원에 판매하고 있다. 사과 2개, 망고 1개, 멜론 1개를 구입했을 때 아래와 같이 총 금액을 구할 수 있다. console.log(1000 * 2 + 1500 + 2500) 이러한 경우 총 금액을 구할 수는 있지만, 나중에 과일 종류가 많아지게 되면 금액을 일일이 찾아서 입력해야하는 번거로움이 있고, 또 오탈자가 발생하거나 금액을 착각했을 때 전부 찾아서 수정해주는 것이 어렵다. 이럴 때에 변수를 선언하여 과일 금액과 총 금액을 조금 더 편리하게 관리할 수 있다. // 변수 선언 let appleP.. 2021. 7. 13.
자바스크립트 자료형 타입(Java Script - Data type) 파이썬 기초 강의를 다 듣고 나서 중급 강의를 듣기 전, 자바 스크립트 기초 강의를 먼저 듣기로 했다. 아직 5~6강 밖에 듣지 않았지만 목차를 보니 데이터 타입, 조건문 등 파이썬 강의에서 다루었던 내용과 유사한 것이 많을 것 같다는 느낌적 느낌(!)이 들었다. 겹치는 부분이 있더라도 복습을 한다는 마음으로 열심히 듣고, 정리가 필요하다고 생각되는 부분들은 블로그에 기록해 두려고 한다. 자바스크립트 자료형 타입(Data type) 자바스크립트 뿐만 아니라 다른 프로그래밍 언어에 공통적으로 적용되는 개념이니 꼭 이해하고 넘어가는 것이 좋을 것 같다. 숫자(Number) 정수(Interger) 타입과 소수(Floating point) 타입으로 다시 나눌 수 있다. 정수 타입은 음의 정수, 0, 양의 정수를.. 2021. 7. 12.
<b>와 <strong>, <i>와 <em>의 차이 태그와 태그는 웹페이지에서 확인할 때는 똑같이 볼드체로 보인다. 태그와 태그도 마찬가지로 동일하게 이탤릭체로 표기된다. 하지만 이 태그들은 시각적으로는 똑같아 보일지 몰라도, 알고 보면 각각 다른 의미를 가지고 있다. 와 차이점 태그는 bold의 약자로 특정 텍스트에 주의를 끌기 위해 글씨가 굵게 표시된다. 단순 시각적 요소로 사용되며, 주변의 컨텐츠와 비교했을 때 더 중요하다는 의미는 아니다. 하지만 와 달리 태그는 '매우 중요, 긴급, 경고'의 의미를 가지고 있다. 와 의 차이점 태그는 italic의 약자로 기울임꼴로 표시된다. 기술 용어, 외국어 구절, 등장인물의 생각 등 특정 이유로 주위와 구분을 해야 할 때 사용한다. 은 주위 텍스트와 비교했을 때 해당 부분을 강조하고 싶은 경우에 사용한다. 단.. 2021. 7. 8.
그누보드 게시물 작성시 메일 알림 오류 해결방법(알림 메일 오지 않을때) 테스트 메일이 오지 않는 현상을 어찌저찌 해결하고 나서 (아래 링크 참고) 설레는 마음으로 게시물을 작성했는데 아무리 기다려도 알림 메일이 오지 않았다 OTL 2021.06.24 - [개발자 꿈나무/그누보드5] - 그누보드 어드민 메일 테스트 오류 해결방법(테스트 메일 오지 않을때) 구글신님의 도움을 받아 몇시간만에 원인을 찾아 해결할 수 있었다. 찾아보니 여러가지 방법이 있는 것 같은데 내가 사용한 방법을 아래에 정리해두려고 한다. 그누보드 게시물 등록시 알림 메일이 오지 않을 때 가장 먼저 테스트 메일이 발송되는지 확인해보고, 테스트 메일은 잘 도착하는데 게시물 등록시에만 알림 메일이 오지 않을 때는 아래 방법을 시도해보면 좋을 듯 하다. 경로는 "public_html > skin > board > .. 2021. 6. 24.