CLIEL LAB

1. form 실제 입력을 수행하는 태그와는 성격이 다르지만 입력 처리를 위한 거의 대부분의 경우에 form이 사용됩니다. form은 사용자가 입력한 내용을 서버로 전송하는 역할을 담당하며 태그 자체는 아무런 UI 표시를 하지 않습니다. form에서 action속성은 사용자가 입력한 데이터를 서버의 어느 페이지로 전송할지를 지정하는 것이며 method는 데이터가 전송되는 방식을 지정하는 것입니다. method는 post와 get값을 가질 수 있는데 post는 값을 외부에 노출하지 않고 전송하는 방식이며 get은 'http://cliel.com/memberjoin.php?name=kim&nick=ji'처럼 URL뒤에 값의 이름과 값을 붙이는 형식으로 전송하는 것을 의미합니다. 2. input 가장 많이 사..

Web/HTML5 & CSS3 2019.09.27 13:14

비디오 태그는 웹상에서 동영상을 재생할 수 있도록 하는 태그입니다. video태그에서 src는 동영상의 위치를 지정하는 속성으로 http://cliel.com/sample.mp4처럼 웹상의 경로나 /video/sample.mp4 와 같이 서버상의 경로를 지정할 수 있습니다. 또한 controls는 동영상 재생 시 컨트롤이 가능한 UI를 노출하도록 하는 속성입니다. 동영상 파일은 mp4(H.264 + ACC) 형식인 경우 모든 브라우저에서 지원이 가능하지만 현재 글을 작성하는 시간 기준으로 WebM(VP8+Vorbis)과 OGV(Theora+Vorbis)는 크롬과 파이어폭스, 오페라만 지원합니다. 따라서 브라우저별로 다른 형식을 재생해야 한다면 다음과 같이 source태그를 사용해야 합니다. 이때 sour..

Web/HTML5 & CSS3 2019.09.25 10:50

웹상에서 오디오를 재생하기 위해서는 audio 태그를 사용합니다. HTML5 전용 태그이므로 익스플로러 8 이하에서는 사용할 수 없습니다. audio 태그에서 src는 음악파일의 경로를 지정하는 속성입니다. http://sample.mp3 처럼 웹상의 경로를 지정할 수 있고, /sample.mp3와 같이 서버상의 경로를 지정할 수도 있습니다. src속성에 사용하는 파일은 예제에서 mp3를 사용했으나 ogg나 wav같은 파일도 사용이 가능합니다. 다만 현재 이 글을 쓰는 시간 기준으로 크롬, 파이어폭스, 오페라만 이 세 가지 파일을 모두 지원하며 익스플로러는 mp3만, 사파리는 mp3와 ogg만 지원이 가능한 점 참고하시기 바랍니다. 만약 각 브라우저마다 각각의 파일형식에 대응해야 한다면 audio태그를 ..

Web/HTML5 & CSS3 2019.09.23 10:38

HTML에서 이미지를 사용하려면 기본적으로 img태그를 사용합니다. img 태그에서 src 속성은 이미지의 경로를 나타냅니다. 여기에 http://cliel.com/sample.jpg 처럼 URL을 통해 이미지를 지정할 수 있고 /images/sample.jpg 처럼 자신의 경로를 지정할 수도 있습니다. 참고로 당장 이미지가 필요하지 않다면 http://placehold.it/350x200 처럼 임시 이미지를 지정할 수도 있습니다. alt 속성을 사용하면 이미지가 존재하지 않거나 기타 이유로 이미지가 표시되지 않을 때 특정 문구를 표시하게 할 수 있습니다. 더불어 width나 height 속성을 사용하면 표시할 이미지의 크기를 지정하는것이 가능합니다.

Web/HTML5 & CSS3 2019.09.20 15:52

테이블(Table)은 HTML에서 표를 만드는 데 사용하는 태그입니다. 1 2 1 2 테이블은 로 시작해 로 끝납니다. 태그 내부에 은 행을, 는 각 행에 있는 셀을 의미합니다. 에서 border 속성을 사용하면 테두리의 두께를 지정할 수 있습니다. 1 2 1 2 태그를 사용하면 테이블의 각 셀에서 '제목'을 표시할 수 있습니다. 날짜 매출 2019.08 2,000 2019.09 3,300 만약 셀에 같은 내용이 있고, 이들 셀을 병합해야 한다면 colspan을 사용하여 원하는 셀만큼 병합할 수 있습니다. 날짜 현매출 전매출 2019.08 2,000 2019.09 3,300 4,000 셀 대신 행을 병합해야 한다면 rowspan을 사용합니다. 날짜 현매출 전매출 2019.08 2,000 2,000 201..

Web/HTML5 & CSS3 2019.09.20 14:27

1. ul 순서 없는 목록을 만듭니다. 자동자 비행기 자전거 2. ol 순서가 있는 목록을 만듭니다. 자동자 비행기 자전거 1과 2에서 는 목록 자체를 지정하는 태그입니다. 이 태그 안에 목록 태그를 다시 집어넣어서 중첩된 목록을 만들 수 있습니다. 자동자 비행기 자전거 두발 자전거 세발 자전거 한발 자전거 3. dl 특정용어를 설명할 때의 목록 태그입니다. 태그로 시작해 태그로 정의할 용어를 지정하고 태그로 설명 목록을 만듭니다. 비행기 빠른이동수단 통계적으로 가장 안전함 다른 이동수단에 비해 비쌈

Web/HTML5 & CSS3 2019.09.19 16:38

-- 현재일에 해당하는 주차 -> 2019년 8월 12일은 8월달 몇주차인가? Select CEILING((DAY('2019-08-12') + DATEPART(DW, '20190801') - 1) / 7.0) -- 특정 주차의 날짜 -> 2019년 8월 3주차의 시작날짜와 끝날짜는? Declare @input Varchar(8); Set @input = '20190803'; Declare @firstday Date; Set @firstday=CONVERT(Date, Left(@input, 4) + '-' + SUBSTRING(@input, 5, 2) + '-01'); Declare @addweek Int; Set @addweek = CONVERT(Int, Right(@input, 2)) - 1; Sele..

Server/SQL Server 2019.09.17 11:30

1. 제목 h1 부터 h6 까지 사용할 수 있으며 뒤의 숫자가 작을 수록 큰 글씨를 보여줍니다. AAA BBB CCC DDD EEE FFF 2. 본문관련 태그 특정 내용을 본문으로 표현하고자 할때는 기본적으로 p(paragraph)태그를 사용합니다. Hello, World! Nullam id dolor id nibh ultricies vehicula ut id elit. Nulla vitae elit libero, a pharetra augue. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum id ligula porta felis euismod semper. Donec sed odio dui. 더불어 줄넘김을 하고자 하는 경우 태..

Web/HTML5 & CSS3 2019.09.10 10:14