06_transition.html 06_transition.css @CHARSET "UTF-8"; /*객체모양 변경*/ #ex div{ width: 100px; height: 100px; background-color: red; border-radius: 0px; transition-property: background-color, border-radius;/*해당하는 2가지 속성에 변형을 준다.*/ transition-duration: 1s; } #ex:hover div{ background-color: blue; border-radius: 50px; }

04_skew.html 04_skew.css @CHARSET "UTF-8"; div{ float: left; margin: 100px; width: 150px; height: 190px; background-color: rgba(0,0,255,0.3); perspective: 200px; } img{ border: 1px solid black; } #i1:hover{ transform: skew(45deg, 0deg); } #i2:hover{ transform: skew(0deg, 45deg); }

03_rotate.html 03_rotate.css @CHARSET "UTF-8"; div{ float: left; margin: 50px; width: 150px; height: 190px; background-color: rgba(0,0,255,0.3); perspective: 200px; } #i1:hover{ transform: rotateX(45deg); } #i2:hover{ transform: rotateY(45deg); } #i3:hover{ transform: rotate(45deg); }

02_scale.html 02_scale.css @CHARSET "UTF-8"; div{ margin: 50px; width: 150px; height: 190px; background-color: rgba(0,0,255,0.3); } img:hover{ transform: scale(0.7,1.2); }

첫번째 사진 링크: https://t1.daumcdn.net/cfile/tistory/99B88E3359A3842A36 두번째 사진 링크: https://t1.daumcdn.net/cfile/tistory/9968863359A3842A24 세번째 사진 링크: https://t1.daumcdn.net/cfile/tistory/99CCF53359A3842A0F 네번째 사진 링크: https://t1.daumcdn.net/cfile/tistory/99C4A13359A3842A37 다섯번째 사진 링크: https://t1.daumcdn.net/cfile/tistory/9995693359A3842A0A 여섯번째 사진 링크: https://t1.daumcdn.net/cfile/tistory/99DA9B3359A38..

22_tb.html 주요 국가 통화율 통화명 매매기준율 전일대비 등락률 미국(USD) 1,090,80 1.20 -0.11% 일본(JPY 100) 1,359.59 5.58 -0.41% 중국(CNY) 주요 국가 통화율 통화명 매매기준율 전일대비 등락률 미국(USD) 1,090,80 1.20 -0.11% 일본(JPY 100) 1,359.59 5.58 -0.41% 중국(CNY) 22_tb.css @CHARSET "UTF-8"; table{ border-collapse: seperate; margin-bottom: 20px; } #tb1 th, #tb1 td{ border: 1px solid black; empty-cells: show;/*빈칸의 값을 보여주곘다. 기본값*/ } #tb2 th, #tb2 td{ b..

21_tb.html 주요 국가 통화율 통화명 매매기준율 전일대비 등락률 미국(USD) 1,090,80 1.20 -0.11% 일본(JPY 100) 1,359.59 5.58 -0.41% 중국(CNY) 174.78 0.30 -0.17% 21_tb.css @CHARSET "UTF-8"; table{ border-collapse: seperate; /*기본값 //분리됨*/ border:outset 10px;/*inset:파이게 //outset:튀어나오게 선의 굵기*/ border-spacing:15px; } th,td{ border: inset 5px; }

20_tb.html 주요 국가 통화율 통화명 매매기준율 전일대비 등락률 미국(USD) 1,090,80 1.20 -0.11% 일본(JPY 100) 1,359.59 5.58 -0.41% 중국(CNY) 174.78 0.30 -0.17% 주요 국가 통화율 통화명 매매기준율 전일대비 등락률 미국(USD) 1,090,80 1.20 -0.11% 일본(JPY 100) 1,359.59 5.58 -0.41% 중국(CNY) 174.78 0.30 -0.17% 20_tb.css @CHARSET "UTF-8"; #tb1{ border:1px solid black; margin-bottom: 20px; } #tb2{ border-collapse: collapse; /*테두리 합침*/ border: 1px solid black; }..

19_tb.html table layout CONSTRAINT_VALIDATION table layout을 이용한 셀 너비 조절 19_tb.css @CHARSET "UTF-8"; #tb1{ width: 300px;/*테이블 크기 가로*/ table-layout: fixed;/*fixed: 셀 너비 고정, auto: 셀 너비 자동 조정(기본값)*/ word-break: break-all;/*단어를 너비에 맞춰서 쪼개기*/ height:auto;/*테이블 크기 세로*/ /*위치를 나타내는 값은 position// left top*/ } th,td{ border: 1px solid black; padding: 5px; }

18_column.html Joandora 가장 제주다운 수산리집 요안도라는 게스트 하우스(Guest House) 형식의 농어촌 민박입니다 성산의 날씨는 다음주 내내 높은 구름에 햇살 가득이라고 합니다. 목요일이면 섭씨 27도까지 오른다고 하지만, 늘 부는 바람이 쾌적한 균형을 잡아 마당에 마당에 나가 앉아 있는 시간이 많아질듯 합니다. 오늘은 사진에 보이는 긴 돌담을 따라 들어오는 요안도레 올레 입구에 특곤색의 대문을 달았습니다. 내일은 두달 여동안 밖거리에 만든 데스트 하우스에 연백색의 황토 페인트를 칠할 예정입니다. 그리고 이것저것 사소한 저이를 마치고 나면, 나이 드시고 젊고 한 미지의 새식구들을 설렘으로 만나고 함께하고, 도시의 바븐 생활로 소원해진 오래된 친구와의 우정을 이 제주에서 새롭게 열..

17_clear.html 예약 방법 및 요금 ¤ 예약 방법 요안도라 예약의 가장 빠른 방법은 인터넷 전화 070.4529.8743으로 직접 통화하시거나 문자를 남기시는 것입니다. 인터넷 전화라 시외전화 요금이 부과되지 않습니다. 제주특별자치도 남제주군 성산읍 수산리 000 번지 요안도라 Copyright ⓒ. All rights reserved. 17_clear.css @CHARSET "UTF-8"; .content{ float: left; } aside{ float: right; } footer{ clear: both; }

16_float.html 예약 방법 및 요금 ¤ 예약 방법 요안도라 예약의 가장 빠른 방법은 인터넷 전화 070.4529.8743으로 직접 통화하시거나 문자를 남기시는 것입니다. 인터넷 전화라 시외전화 요금이 부과되지 않습니다. 제주특별자치도 남제주군 성산읍 수산리 000 번지 요안도라 Copyright ⓒ. All rights reserved. 16_float.css @CHARSET "UTF-8"; .content{ float: left; } aside{ float: right; }