진성 소프트

특정 Style이 전체 적용 될 때 JavaFX CSS를 사용하는데 CSS 파일을 합치면서 갑자기 transparent background 효과가 화면 전체 control에 적용되는 문제가 발생했습니다. 원인조차 모르고 있었죠. 더군다나 style sheet를 합친지라 파일 안에 몇 천줄이 넘는 코드가 있어서 찾아내는 것도 쉽지 않았습니다. 그렇게 살펴보다 보니 아래와 같은 코드를 발견했습니다. 깜빡하고 , 뒤에 선택자를 적어 넣는 것을 빼먹었던 것이죠. 1234table-view,{ -fx-background-color:trnasparent; ....} Colored by Color Scriptercs , 뒤에 아무것도 없다는 것은 모든 선택자를 의미하기 때문에 문제가 발생하는 것이었습니다.

가끔씩 보면 웹 문서가 한글이 깨지는 경우가 있는데, 이유를 알아보니 브라우저 상에서 인식하는 인코딩 방식과 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를 변경합니다- 이 그림을 보면 확실히 알 수가 있습니다. 엘리먼트 선택자는 이렇게 해당 태그를 모두 스타일을 입히기 때문에 세세한 스타일 보다는 대략적인..

CSS(Cascading style sheet) 란 stylesheet 언어로 HTML 문서를 어떻게 보여질지를 기술하는 언어입니다. 간단하게 이야기 하면 HTML로 작성된 웹문서를 CSS를 통해서 요소들을 꾸며주는 것이죠. Style을 적용한다고도 할 수 있는데 바로 이 스타일이 적용되는 원리를 설명하겠습니다. 문법적인 내용 보다는 간단한 개념적인 설명을 하는 것이 좋을 것 같아서.. 제가 본 어느 강의의 설명에 의하면 CSS를 법에 비유했습니다. 설명을 하자면, 미국에 우리집이 있다고 생각합시다. 미국 전체의 "월요일은 놀이터를 가면 안된다"라는 법이 있다고 생각을 해봅시다. 그렇다면 그 법은 미국 전체에 적용이 되겠죠? 그래서 우리 집도 함께 따라야 할 테구요. 그런데 뿐만 아니라 우리가 살고 있는..