반응형

1. 선언적 함수가 최우선적으로 실행!

웹 브라우저는 script 태그 내부의 내용을 한 줄씩 읽기 전에 선언적 함수부터 읽는다.

따라서 아래와 같은 경우도 오류없이 잘 실행된다.

<script>

함수();

function 함수() { alert('실행될까?'); }

</script>


*Tip! 단, 익명 함수는 script 태그 내용을 한줄씩 읽어가다 만났을 때 정의한다.

즉, 아래와 같은 경우에는 변수를 선언하기 전에 변수를 사용했으므로 오류가 발생한다.

<script>

함수();

var 함수 = function () { alert('실행될까?'); }

</script>


2. 타이머 함수는 모든 일이 끝나면 실행!

웹 브라우저에 처리를 부탁하는 함수(대표적으로 타이머 함수와 웹 요청)는 웹 브라우저가 처리를 한 뒤 완료되었다고 javasciprt에 알려주는 방식이다.

따라서 스크립트 순서상으로 먼저 처리를 부탁하였다고 해도 완료되었다는 것을 받는 것은 다른 것들을 처리한 뒤라고 생각하면 된다.

예를 들어, 택배를 신청하고 다른 집안일들을 하고 있으면 택배가 집에 왔어도 집안일이 다 끝나야 택배를 받을 수 있는 것이다. (택배기사가 벨 누르면 될텐데 ㅇ_ㅇ;;)


<script>

setTimeout(function () { // 0초 후에 SetTimeout이라는 문자열을 출력하라는 함수

alert('Set Timeout');

}, 0);


while (true) { }

</script>

위와 같은 경우 순서상으로 SetTimeout이라는 문자열을 출력하라고 함수를 먼저 실행시켰지만 다음 순서인 while(true)가 끝나지 않으므로 절대 SetTimeout이라는 문자열은 볼 수 없다.

반응형
블로그 이미지

rootable

,
반응형

1. overflow 속성을 사용해 스크롤을 넣을 수 없다.

- 대부분 적용할 수 없고 가끔 가능한 스마트폰 웹 브라우저도 있다 ( ex)갤럭시 넥서스 기본 내장 브라우저, 특수한 기능을 사용한 아이폰 )

 - 넣고 싶다면 JavaScript를 이용하도록 ! 

2. 상태 선택자를 사용할 때 주의해야 한다.

- 스마트폰은 터치를 사용한다 -> hover 선택자와 active 선택자를 사용할 때 주의해라.

  * hover 선택자 : 마우스가 링크 위에 있을 떄 / active 선택자 : 마우스가 링크를 클릭했을 때

3. 동위 선택자에 제한이 있다,

 - 대부분의 웹 브라우저가 ~ 선택자를 지원하지 않으나 점점 지원하는 브라우저가 늘고 있다.

4. iOS의 웹 브라우저는 label 태그에 버그가 있다.

- ios 사파리는 label 태그를 눌러도 반응이 없으니 이를 해결하기 위해서는 label태그에 onclick 속성을 입력해야 한다,

<body>

<label for="name" onclick="">Name</label>

<input id="name" type="text" />

</body>

5. 안드로이드의 웹 브라우저는 대부분 CSS3 그레이디언트를 적용하지 못한다.


참고 : 모던 웹 디자인을 위한 HTML5 + CSS3

반응형
블로그 이미지

rootable

,
반응형

모든 웹 브라우저에서 동일한 출력을 만들기 위해 첫 번째 스타일시트에 초기화 코드를 넣는다.


전 세계적으로 가장 많이 사용되는 초기화 코드는 아래와 같다.

Eric Meyer's Reset CSS (http://meyerweb.com/eric/tools/css/reset)

HTML5 Doctor CSS Reset (http://html5doctor.com/html-5-reset-stylesheet)

YUI 3 Reset CSS (http://developer.yahoo.com/yui/3/cssreset)


하지만 아래의 근거로 CSS 초기화를 반대하는 사람들도 있다.

  • 작업량이 많다.
    초기화한 태그에 대해 적절한 모양을 재정의 해주어야 합니다. 상당히 양이 많을 뿐 아니라 지루한 작업입니다.
  • 사이트의 성능이 저하된다.
    웹브라우저에 내장된 스타일 시트를 거의 사용하지 않고 서버의 설정을 가져와 사용하므로 추가적인 서버 요청이 발생합니다. 이에 따라 사이트의 성능이 저하될 수 있습니다.
  • 꼭 모양이 같아야 하나?
    웹사이트 방문자는 보통 한가지의 웹브라우저를 사용합니다. 따라서 현재의 모양이 다른 웹브라우저에서 볼 때와 다르다는 것을 알기 힘듭니다. 또한 다르게 나온다는 것을 안다 하더라도 그다지 중요한 문제는 아니라는 것입니다.

따라서 각자 어느 웹사이트를 만들지 잘 생각해서 초기화할지 안할지를 결정해야 한다.


출처 : 모던 웹 디자인을 위한 HTML5+CSS3 입문 

         http://www.cmsfactory.net/node/10137

반응형
블로그 이미지

rootable

,
반응형

1. 위치속성과 관련된 공식

"자손에게 position 속성을 absolute 키워드로 적용하면 부모에게 height 속성을 입력합니다."

왜? 부모 태그가 영역을 차지하지 않으면 자손은 absolute 속성이라 무조건 그 자리를 차지하고 있으므로 해당 부모태그의 다음 태그가 자손태그와 겹쳐서 나타날 수 있기 때문

"자손의 position 속성을 absolute 키워드로 적용하면 부모의 position 속성을 relative 키워드로 적용합니다."

 왜? 그래야지만 absolute속성을 가지게 된 자손이 부모를 기준으로 위치를 잡기 떄문


2. float를 이용해 레이아웃을 구성할 때

"자손에 float 속성을 적용하면 부모의 overflow 속성에 hidden 키워드를 적용합니다." (One True Layout 방식)

왜? float속성이 원래 이미지를 글자 위에 띄우기 위해 만들어진 스타일 속성이므로 원하지 않는 것이 부유할 가능성이 높다. 따라서 부모의 overflow 속성을 hidden으로 함으로써 하나의 레이아웃을 생성하여 다른 것이 침투? 부유? 못하게 하는것이다.


3. 태그 가운데 정렬

#main {                        ->가운데 정렬할 태그를 id값으로 선택한 뒤

width: 960px;          ->좌우 길이를 설정하여 고정시킨 뒤

margin: 0 auto;        ->좌우 마진을 auto로 나눈다. 그러면 균등하게 나누어져 가운데에 태그가 위치하게 된다.

     }

※ margin:0 auto;는 margin: 0 auto 0 auto와 같으므로 위,아래는 0 좌,우는 auto로 설정한다는 뜻이다.

반응형
블로그 이미지

rootable

,
반응형

#include <string.h>

//문자 출력 함수

int putchar(int c);

int fputc(int c, FILE * stream);


//문자 입력 함수

int getchar(void);

int fgetc(FILE * stream);


//문자열 출력 함수

int puts(const char * s);

int fputs(const char * s, FILE * stream);


//문자열 입력 함수

char * gets(char * s);

char * fgest(char * s, int n, FILE * stream);


//출력버퍼를 비우는 함수

int fflush(FILE * stream);


//입력버퍼 비우는 함수

void ClarLineFromReadBuffer(void)

{

while(getchar()!='\n');

}


//문자열의 길이를 반환하는 함수

size_t strlen(const cahr * s);

size_t = unsigned int 


//문자열을 복사하는 함수들

char * strcpy(char * dest, const char * src);

char * strncpy(char * dest, const char * src, size_t n);


//문자열을 덧붙이는 함수들

char * strcat(char * dest, const char * src);

char * strncat(char * dest, const char * src, size_t n);


//문자열을 비교하는 함수들

int strcmp(const cahr * s1, const char * s2);

int strncmp(const char * s1, const char * s2, size_t n);


#include <stdlib.h>

int atoi(const char * str); // 문자열의 내용을 int형으로 변환

long atol(const char * str); // 문자열의 내용을 long형으로 변환

double atof(const char * str); // 문자열의 내용을 double형으로 변환

반응형
블로그 이미지

rootable

,