N스크린하이브리드앱과정/HTML&CSS
-
[3주][1일][1~2th] HTML5 : 표 이쁘게 꾸미기(이클립스)N스크린하이브리드앱과정/HTML&CSS 2013. 7. 29. 12:13
1. 테이블 만들고, CSS 적용해서 표 스타일 완성하기 * 테이블 내용 소스(body태그) 프랑스 와인 프랑스 와인 매니아는 프랑스에 많다. 차종 24시간 48시간 72시간 추가요금 SM3 45,000 90,000 135,000 6,000 모닝 42,000 84,000 126,000 6,000 소울 61,000 122,000 183,000 9,000 윈스톰 94,000 188,000 282,000 13,000 제주 5월 기준이며 추가요금은 시간당입니다. 차종 24시간 48시간 72시간 추가요금 SM3 45,000 90,000 135,000 6,000 모닝 42,000 84,000 126,000 6,000 소울 61,000 122,000 183,000 윈스톰 94,000 188,000 282,000 제주..
-
[2주][5일][5~7th] 자바스크립트 실습. alert = 경고창.N스크린하이브리드앱과정/HTML&CSS 2013. 7. 26. 18:51
★ 자바스크립트 실습(1) 1. 새로운 HTML파일을 생성한다.(test1.html) 2. 다음의 코딩을 작성한다. 3. 컴파일 후 실행하면 뜨는 메시지들 (1) alert 메시지 ☞ , 둘 다 가능! 경고 메시지가 출력된다. (2) js파일을 만들어서 출력하기 //js파일의 내용을 불러옴 (3) 하이퍼링크 만들기 하이퍼링크 하이퍼링크를 누르면, 자바스크립트 메시지가 뜬다. (4) 버튼 만들기 하이퍼링크 버튼을 누르면, "버튼클릭" 경고창이 표시된다. ★ 자바스크립트 실습(2) (1) 계산결과 경고창에 표시하기 ☞ 11번줄 (2) 계산결과 일반 창에 표시하기 ☞ 8~10번 ★ 자바스크립트 실습(3) (1) 이름과 나이 출력하기 ☞ 20번부터... var name="홍길동"; var age=25; docu..
-
[2주][4일][1~2교시] CSS: 레이아웃 만들기, 영역 나누기.N스크린하이브리드앱과정/HTML&CSS 2013. 7. 25. 11:03
레이아웃 만들고, 영역 나누기 - #left{}, ※ 스타일 적용이므로 태그 안에 들어간다. css에 따라 같은 html 구조라도 디자인의 느낌이 많이 달라진다. css에 따라 같은 html 구조라도 디자인의 느낌이 많이 달라진다. css에 따라 같은 html 구조라도 디자인의 느낌이 많이 달라진다. #left를 right로 적용했을때 #left{ float:right; width:150px; background-color:#ff0; //노랑 margin:0px 0px 0px 50px; //위쪽부터 시계방향순: 위,오른,아래,왼쪽 padding-bottom:50px; }
-
[2주][4일][1~2교시] CSS: 가상선택자. 롤오버효과, 하이퍼링크 등N스크린하이브리드앱과정/HTML&CSS 2013. 7. 25. 10:44
**가상선택자**(선택자 끝에: 가상선택 내용붙임) ※ 스타일 css 적용은 123 456 789 123 456 789 ☆ 롤오버효과 - 표 배경 ☆ 롤오버효과 - 셀 안의 글자 두번째 행의 셀 안의 글자가 파란색이 되었다. ☆ 하이퍼링크 밑줄 없애기 ☆ 하이퍼링크에 롤오버 적용 전체소스 ☆ 하이퍼링크가 색 바뀌면서 롤오버효과 주기 마우스를 갖다 대었을 때 ☆ 표에 밑줄효과 주기 (1) 표에 클래스 이름을 지정해준다. 123 456 7 8 9 (2) 스타일을 적용한다.
-
[2주][3일] 웹표준: market.html에 css 스타일 적용하기N스크린하이브리드앱과정/HTML&CSS 2013. 7. 24. 11:05
*market.html을 css스타일로 적용해보기 --> style은 3-TOP System[유리, 창호, 실란트]창틀에서 유 리, 실란트까지 KCC의 첨단기술을 적용하여 에너지를 빈틈없이 관리... 3-TOP System[유리, 창호, 실란트]창틀에서 유 리, 실란트까지 KCC의 첨단기술을 적용하여 에너지를 빈틈없이 관리... 3-TOP System[유리, 창호, 실란트]창틀에서 유 리, 실란트까지 KCC의 첨단기술을 적용하여 에너지를 빈틈없이 관리... (1) table 스타일 적용 결과 (2) h3에 스타일 적용 결과 (3) img에 스타일 적용 결과 *layout.html 만들기 전체 소스 css에 따라 같은 html 구조라도 디자인의 느낌이 많이 달라 진다. css에 따라 같은 html 구조라도..
-
[2주][3일] 웹표준: css선택자의 3가지 종류. {아이디/클래스/태그} 선택자N스크린하이브리드앱과정/HTML&CSS 2013. 7. 24. 10:28
*css선택자의 3가지 종류 알아보기 //css스타일 시작 body{ font-family:"맑은 고딕"; //글자체 font-size:14px; //글자크기 color:#00ff00; //글자색 } 앞으로의 공부 계획! 아침 6시 30분 기상 아침 8시 30분 강의실 도착 어제 학습내용 훑어보기 딴 인터넷 검색 안하기 *css로 td 꾸미기(1) td{ color:#0000ff; //td색깔 border-width:3px; //테두리너비 border-color:#0000ff; //테두리색깔 border-style:solid; //이거 안적어주면 table테두리가 안보임. width:150px; background-color:#00ff00; padding:15px; } table 꾸미기 - 1 table..