'CSS3'에 해당되는 글 4건

  1. 2010.06.21 HTML5 모바일 웹 어플리케이션 프레임웍 Sencha Touch
  2. 2010.05.28 CSS3 Click Chart by Impressive Webs
  3. 2010.05.17 HTML5 데모와 예제 목록을 공유
  4. 2010.03.11 CSS3의 기본적인 사용방법

HTML5 모바일 웹 어플리케이션 프레임웍 Sencha Touch

HTML5 모바일 웹 어플리케이션 프레임웍 Sencha Touch ===J.O.B===/JAVASCRIPT 2010. 6. 21. 19:51
자바스크립트 프레임웍으로 유명한 extJS가 모바엘 웹 어플리케이션 프레임웍 Sencha Touch로 탈바꿈했다.

http://www.sencha.com/ 로 들어가보면 이렇게 아래와 같이 소개를 해놨는데..

Sencha Touch allows your web apps to look and feel like native apps. Beautiful user interface components and rich data management, all powered by the latest HTML5 and CSS3 web standards and ready for Android and Apple iOS devices. Keep them web-based or wrap them for distribution on mobile app stores

대충 보자면 html5와 css3를 기반으로 뭐 안드로이드, 애플 iOS등의 모바일 기반에서 네이티브 어플리케이션처럼 개발 할 수 있다는 내용 같은데~.. 영어가 짧아서.. 일단 데모영상을 보자면 아이폰 기본 어플리케이션과 아주 유사하게 동작한다는것을 알 수 있다.

아래는 데모 동영상이다.


Sencha Touch Introduction from Sencha on Vimeo.

저작자표시

'===J.O.B=== > JAVASCRIPT' 카테고리의 다른 글

window.onunload를 이용한 브라우저 상태캐치  (0) 2010.03.24
Posted by 샤가No01
:

CSS3 Click Chart by Impressive Webs

CSS3 Click Chart by Impressive Webs ===J.O.B===/CSS 2010. 5. 28. 15:00


css3에 대한 다양한 예제를 볼 수 있는곳이다.

해당 사이트는 Chrome 4+, Safari 4+, or Firefox 3.6+ 이상에서 제대로 볼수 있다.

http://www.impressivewebs.com/css3-click-chart/
저작자표시

'===J.O.B=== > CSS' 카테고리의 다른 글

CSS3의 기본적인 사용방법  (0) 2010.03.11
Posted by 샤가No01
:

HTML5 데모와 예제 목록을 공유

HTML5 데모와 예제 목록을 공유 ===J.O.B===/HTML 2010. 5. 17. 18:52

Remy라는 분은 HTML5데모와 예제목록을 공유하는 사이트를 오픈했습니다.

HTML5에서 구현 가능한 기능들과, 브라우저별로 한눈에 보기 쉽게 구성되어 있습니다.

각 항목별로 필터링이 가능합니다.

해당 사이트는 CSS3으로 구성되어 있으므로 CSS3데모가 가능한 브라우저에서는 CSS3가 적용됩니다. IE8이하 브라우저는 안됩니다. 하하하하하하



사이트  : http://html5demos.com/

저작자표시

'===J.O.B=== > HTML' 카테고리의 다른 글

Local Storage  (0) 2012.03.22
Eclipse IDE 에서 Zen-Coding 소개  (1) 2010.05.31
HTML5 강좌 관련 사이트  (0) 2010.05.20
Posted by 샤가No01
:

CSS3의 기본적인 사용방법

CSS3의 기본적인 사용방법 ===J.O.B===/CSS 2010. 3. 11. 00:58

내가 많은 정보를 얻고 있는 파이어준(http://firejune.com)님의 블로그에서 얻은 정보이다~ 아직 자세히 읽어보진 않았지만.. 그래도 css3에 대해서 공부해야하는 나로서는 너무 좋은 정보다.

RGBA(Red,Green,Blue,Alpha)

rgb컬러값과 투명도를 설정할 수 있다. alpha는 %인데 0은 투명, 1은 불투명


font, border, background, show등 rgb컬러값을 설정할수 있는곳에서 쓸수 있다.

Text Shadow

텍스트에 그림자 주는 방법.. 정말 빨리 CSS3가 보급되었으면 좋겠다.. ㅜㅜ



text-shadow: 0 1px 0 #fff, 0 -1px 0 #000;
이렇게 하면 아래와 같은 효과가 나타난다.

Border Radius

둥근 박싱처리. 이제 투명한 gif와 png의 시대는 가라!! 

각각의 모서리에다가 값을 줄수도 있고.. 

Box Shadow

text shadow와 마찬가지로 box에도 그림자를 줄수 있는 방법이다.


박스 하나에 여러개의 그림자를 선언 할 수도 있다.

-moz-box-shadow:
-2px -2px 0 #fff,
2px 2px 0 #bb9595,
2px 4px 15px rgba(0, 0, 0, .3);




파이어준님 블로그 : http://firejune.com/1562 

저작자표시

'===J.O.B=== > CSS' 카테고리의 다른 글

CSS3 Click Chart by Impressive Webs  (0) 2010.05.28
Posted by 샤가No01
:
1 

카테고리

최근에 달린 댓글

태그목록

하단 사이드바 열기
BLOG main image

티스토리툴바