진성 소프트

가끔씩 보면 웹 문서가 한글이 깨지는 경우가 있는데, 이유를 알아보니 브라우저 상에서 인식하는 인코딩 방식과 html 파일의 인코딩 방식이 달라서 였습니다. 해결 하는 방법은 다음과 같습니다. 1. html 파일의 인코딩 방식은 사용하는 에디터에 따라서 다르기 때문에 에디터 설정을 바꾸는 방법. 2. 브라우저의 인코딩 방식을 변경하는 방법. 3. HTML 코드 상에서 인코딩 관련 태그를 변경 해주는 방법이 있습니다. 이런 식으로 말이죠.

앞서 저희는 3개의 선택자(Seletor)를 살펴 보았는데요. CSS의 진정한 힘은 바로 여기서 나옵니다. 선택자를 결합 할 수 있다는 것입니다. 어떻게 할지는 이제부터 알아 보겠습니다. 1. 엘리먼트와 클래스 선택자의 결합 (Element With Class Selector) - 말 그대로 엘리먼트 선택자와 클래스 선택자를 결합한 형태 인데요, 좀 더 세세한 스타일링이 가능합니다. 보시다 싶이 태그를 가진 엘리먼트 중에서 "big" 이라는 클래스를 가지고 있는 요소들에 스타일을 적용했습니다. 공백 없이 바로 두 엘리먼트를 적어 주면 됩니다. 결과는 같은 클래스를 가지고 있더라도 다른 엘리먼트에는 스타일이 적용이 안되는 것을 볼 수가 있습니다. 2. 자식 선택자( Child Selector ) - 한 엘..

CSS를 사용하다 보면 여러 가지 선택자로 인해서 같은 태그에 다른 스타일이 적용되는 경우가 있는데요. 이럴 땐 어떻게 될까요? 첫 번째 CSS를 소개 할때도 잠깐 얘기 했지만 가장 가까이 있는 룰이 적용됩니다. 그런데 가까운 룰이라는 얘기는 곧 가장 구체적인 룰 이라는 얘기와 같습니다. 개념적으로만 설명했는데 이제 구체적으로 알아보겠습니다. 간단합니다. 앞으론 이 그림을 생각하시면 됩니다. 왼쪽부터 인라인 방식, 아이디 선택자, 클래스 선택자, 엘리먼트 선택자 입니다. 자 이제부터는 저 녀석들을 점수판 이라고 생각해봅시다. 해당 되는 녀석이 있으면 1점씩 올리는 방식입니다. 이렇게만 봐선 이해가 어려울 것 같아서 예를 들어 설명하겠습니다. 우리가 태그를 스타일링 했다고 가정해봅시다. 이런 식으로 말이죠..

CSS를 본격적으로 적용하기 위해선 html 문서에 적용을 해야겠죠? 그래서 이번에는 HTML 문서에 CSS를 적용하는 방법을 알아보겠습니다. 크게는 3가지 방법이 있습니다. 1. 인라인 방식( Inline Style Sheet)- HTML태그에 직접 style 속성을 집어넣는 방식입니다. 태그 단위로 적용되기 때문에 재사용이 불가능 하다는 단점이 있습니다. 하지만 CSS 적용 룰에서는 가장 높은 순위로 적용이 됩니다. ( 이 내용은 뒤에서 설명하겠습니다. ) - 이런 식으로 사용하며 해당 태그(위에서는 P)가 선택자가 됩니다. 그리고 CSS에는 속성(property) 와 값(value)가 들어갑니다. 여러 속성을 사용할 때는 세미콜론( ; ) 으로 추가합니다. 2. 내부 스타일 시트 ( Internal..

제가 소개할 프로그램은 코드 에디터인 Sublime Text 입니다. 이 에디터가 가진 특성으로는 작고 가볍다모든 기능들을 단축키로 이용이 가능하다.플러그인을 통해 기능 확장이 용이하다.좌측의 네비게이션에서 클릭만해도 파일의 내용을 바로 볼 수 있다.vi 스타일로 사용이 가능하다. http://www.sublimetext.com/3 이 곳에서 다운로드가 가능합니다. Web 프로그래밍에도 사용하기가 편리합니다. :)

CSS를 이용해서 HTML문서의 스타일을 적용하려면 HTML의 태그에다가 선택자라는 녀석을 적용하게 됩니다. CSS 에서는 HTML의 태그들을 선택자라는 요소로 스타일을 적용하게 됩니다. 선택자의 종류에는 크게 엘리먼트(Element), 클래스(Class), 아이디(Id) 가 있습니다. 직접 예를 통해서 저 세가지 요소를 설명하겠습니다. 1. 엘리먼트(Element)- 엘리먼트 선택자는 HTML의 태그 그 자체로 스타일을 입히기 때문에 HTML 문서 상에서는 따로 해줘야할 작업은 없습니다. - 이 코드는 CSS 상에서 모든 p태그를 blue로 Color를 변경합니다- 이 그림을 보면 확실히 알 수가 있습니다. 엘리먼트 선택자는 이렇게 해당 태그를 모두 스타일을 입히기 때문에 세세한 스타일 보다는 대략적인..

Chrome을 많이들 사용하실텐데 많이 사용한다면 단축키를 이용해서 생산성을 높여 보는것도 괜찮을 것 같습니다^^ 원하시는 단축키는 Ctrl + F 로 찾아서 사용하세요 :) 탭 및 창 단축키 작업단축키새 창 열기Ctrl + n시크릿 모드로 새 창 열기Ctrl + Shift + n새 탭을 열어 이동Ctrl + t마지막으로 닫은 탭 다시 열어 이동Ctrl + Shift + t다음에 연 탭으로 이동Ctrl + Tab 또는 Ctrl + PgDn이전에 연 탭으로 이동Ctrl + Shift + Tab 또는 Ctrl + PgUp특정 탭으로 이동Ctrl + 1 ~ Ctrl + 8마지막 탭으로 이동Ctrl + 9현재 탭에서 홈페이지 열기Alt + Home현재 탭의 인터넷 사용 기록에 저장된 이전 페이지 열기Alt + ..

개발자가 되려면.. 기본에 충실해야 되겠죠?? '나는 프로그래머다'의 정도현 개발자 님께서 추천해주신 Google Technical Development Guide 라는 곳인데요. 개발자로서 기술을 배울수 있는 곳입니다. 저도 많이 참고 하고 있습니다 :) https://www.google.com/about/careers/students/guide-to-technical-development.html