스마트웹앱콘텐츠전문가 400

웹페이지에서 css 적용하는 방법들

웹페이지 상에서 즉, HTML파일에서CSS를 적용시키는 방법은 - 외부 스타일 시트- 내부 스타일 시트- 태그내에 직접(inline) 스타일 지정 이렇게 3가지가 있다. 1. 외부 스타일 시트 외부의 스타일 시트 파일(.css)을 HTML파일에 연결하여 사용하는 방법 ex) 2. 내부 스타일 시트 HTML 파일 상의 head 안에서 직접 스타일을 정의하는 방법 ex) 3. 태그 내에 직접 스타일 지정 ex) cf. css 적용시키는 방법들의 범위 비교 : 외부 스타일(스타일 시트 파일을 연결한 파일 내에서만)> 내부 스타일(해당 html파일내에서만) > 태그 내에 직접 스타일 지정(해당 태그만) cf. css 적용 우선 순위 높음1. 속성값 뒤에 !important 를 붙인 것.2. 태그에 직접적(inl..

[페이스북]자바스크립트 SDK의 페이스북 로그인

1. 페이스북 로그인- 자바스크립트 SDK의 로그인 대화상자를 사용하여 로그인을 유도하는 동작을 구현할 수 있음.- 기본 형태 : FB.login(function(response){//response 객체를 다루는 코드. });로그인 상태 확인하기 : 웹 페이지를 읽어 들일 때, 첫번째 단계로 사용자가 페이스북 로그인을 사용하여 이미 앱에 로그 인을 했는지를 확인함. FB.getLoginStatus를 호출하여 이 프로세스를 시작함. 이 함수는 페이스북 호출을 요청하여 로그 인 상태를 가져오고, 결과를 통해 콜백 함수를 호출할 수 있음.status를 사용하는 수정된 형태 : FB.login(function(response){ if(response.status === 'connected'){}else{} }..

[PHP]난수 생성

임의의 수, 난수 발생시키기 mt_rand(최소값, 최대값) 함수 사용 + 난수 반환 시 최소값, 최대값까지 포함 ex) $randNum = mt_rand(1, 10); //randNum 변수 생성, 이 변수는 난수를 발생 시키는 함수인 mt_rand의 반환값을 저장함. echo $randNum; //randNum 변수의 값을 출력 = 난수를 발생 시키는 함수인 mt_rand의 반환값을 출력 ※ 난수의 사용은 의도하지 않은 임의의 결과를 반환하게 만들 필요가 있을 때 사용할 수 있음. 예를 들면, 웹페이지에서 불러오는 파일을 자주 변경하는 경우, 파라미터 값을 난수로 사용하여 매번 다른 파일 주소를 가져와 변경된 결과를 확인 할 수 있음. 특히, 페이스북 디버깅 시.... 이미지 파일등은 변경할 때 마다..

[MySQL]테이블 및 컬럼 다루기

[컬럼 추가]1. 기본적인 쿼리문을 사용하면 기존에 있는 컬럼 다음에 추가가 된다.(=맨 뒤에 추가가 됨)ALTER TALBE 테이블명 ADD 컬럼명 자료형 2. 쿼리문 뒤에 'FIRST'라는 것을 사용하면 해당 테이블의 모든 컬럼 앞에 추가가 된다.ALTER TALBE 테이블명 ADD 컬럼명 자료형 FIRST 3. 쿼리문 뒤에 'AFTER 컬럼명' 을 사용하면 해당 컬럼 다음에 추가가 된다.ALTER TABLE 테이블명 ADD 컬럼명(A) 자료형 AFTER 컬럼명(B) [컬럼 수정]1. 컬럼 속성 수정- ALTER TABLE 테이블명 MODIFY 컬럼명 타입; [컬럼 이름 바꾸기] : 'CHANGE'는 컬럼의 속성 및 이름을 바꿔줌. - ALTER TABLE 테이블명 CHANGE 기존의 컬럼명 새로운 ..

[sns 공유 시 콘텐츠 캐시 변경하기]

페이스북, 트위터, 카카오 공유 시,공유 콘텐츠를 수정하고 해당 콘텐츠를 공유하면은수정한 콘텐츠를 바로 확인할 수 없는 경우가 생길 수 있습니다. 그럴 때에는, 페이스북 - 디버거, 트위터 - Card Validator, 카카오 - 개발자페이지의 캐시삭제도구 및 카카오스토리 링크 정보얻기 를 사용하여서 해결할 수 있습니다. 단, 위 세가지 모두 로그인을 해야 사용이 가능합니다. 페이스북 디버거 : https://developers.facebook.com/tools/debug/(주의 : 페이스북 공유 이미지 변경 시, 반드시 이미지 주소(경로)를 바꿔주어야 한다.)트위터 Card validator : https://cards-dev.twitter.com/validator카카오 개발자 : https://de..

[트위터 공유]모바일 공유 링크

트위터 링크 공유 시,pc와 모바일에서 사용해야 하는 url이 각각 다릅니다. pc에서 사용하는 공유 url을 모바일에서 사용하면,없는 페이지로 나오는 등의 오류를 거쳐서 트위터 로그인 페이지로 리다이렉트 되는 동작을 보입니다. 따라서, pc 공유 시 url : http://twitter.com?status=~~~ 모바일 공유 시 url: https://twitter.com/intent/tweet?text=~~~ 이를 잘 구별해서 사용해야 합니다.

[메타태그]트위터 비디오 공유

트위터 비디오 공유 시 알아두어야 할 몇 가지 트위터 메타 태그를 소개하겠습니다. 이름 설명 twitter:card 트위터 카드의 유형으로 비디오 공유 시 'player'값을 사용해야 합니다. twitter:title 해당 콘텐츠가 카드에 표시 될 떄의 제목입니다. twitter:site 트위터 @username에 기인합니다. twitter:description 해당 콘텐츠의 내용 설명 twitter:player iframe 플레이어에 대한 HTTPS URL웹 브라우저에서 활성 혼합 경고 메시지를 생성하지 않는HTTPS URL이어야 합니다. twitter:player:width 트위터에 지정된 iframe의 너비:픽셀 단위의 플레이어 twitter:player:height 트위터에 지정된 iframe의 ..

유튜브 동영상 제어 api

[동영상 정보 가져오기]var player; player = new YT.PLAYER~...- player.getDuration(): Number 현재 재생 중인 동영상의 재생 시간을 초 단위로 반환- player.getVideoUrl(): String 현재 로르되었거나 재생 중인 동영상의 유튜브 url을 반환- player.getVideoEmbedCode(): String 현재 로드되었거나 재생 중인 동영상이 삽입 코드를 반환(예: )[함수]1. 대기열 함수 : 이 함수를 사용하면 동영상, 재생목록 또는 다른 동영상 목록을 로드하고 재생 할 수 있음. ○ player.loadVideoById("영상id",영상시작초, 영상끝초, "동영상품질") ○ player.cueVideoById("영상id", 영상..