조은호 홈페이지

| 한의학 정보 | 건강 정보 | 카메라와 캠코더 | 홈페이지 관련 | 컴퓨터 관련 | 디자인 세상 | 기독교 신앙 | G12/Cell | 물생활 |
| 도시 정원 | 문화 | 생활 체험 정보 | 오늘도 말씀과 함께 | 포토 겔러리 | 동영상 겔러리 |
| 조은호 정송화 (가족 홈) | 리동철 유미현 | 동사무소 |
| 용정 복지관 후원회 | 입주 홈페이지 | 사이트 맵 |


 아이디 
패스워드

 
로그인 안될 때

홈페이지 관련


전체 메뉴 목록
|| 홈페이지 내 현재 위치 ▶ 조은호 홈페이지 > 홈페이지 관련 > 일반 || 사이트 맵 이동(move to sitemap)

76   1/4

 내용보기

작성자


조은호 (2011-08-11 16:47:19)

Link#1

http://khjins7.tistory.com/19

제목


Html 간단한 속성

<p></p> : 간단한 출력양식 단락을 구분하는 태그로 줄을 삽입한다. 정렬을 지정할 수 있다.

ex> <p align="center">

<q></q> : 인용구 - 안의 문장을 " "(쌍따옴표)로 출력해준다. 인용구를 표현할 때 쓴다. 인라인형식으로 <p>안에 있어야 한다.

<blockquote></blockquote> : 독립적으로 쓰이는 단락구분 문단표시 이걸 이용하면 이 안의 내용이 따로 블락 처리 되며 이부분은 들여쓰기가 되어진다. 긴 인용구

<br> : 줄바꿈 /n 과 같다.

<u></u> : 밑줄을 긋는다. 허나 링크연결표시랑 헷갈려서 많이 사용하지 않는다.

<hr> : 제목이 없는 새로운 구획 같은 수평선을 만들어 라인 구분, 선을 그리는 태그, 정렬, 색상, 굵기, 가로길이를 지정할 수 있다.

ex> <hr align="right" color="red" size="10" width="300" >

<li></li> : List Item 리스트 항목을 표시해주는 엘리먼트

<ol></ol> : Ordered List 리스트 항목의 순서를 표시해줌

<ul></ul> : Unordered List 리스트 항목이 순서가 필요없을때

<ol>과<ul>은 <li>와 함께 쓰인다. 그래야 의미가 있으니까.. 또한 블록 엘리먼트 이다. 실수로 <p>와 같은 인라인 엘리먼트 안에 넣지 않도록 한다.

<dl></dl> : Definition List 정의된 리스트를 표현 항목을 설명하는 부수적인 리스트를 표현할때 쓰는 엘리먼트, 사전식 목록

<dt></dt> : 정의된 리스트 안의 항목을 나타낼때, 제목

<dd></dd> : 정의된 리스트 안의 항목을 설명해주는 엘리먼트, 설명

위의 3개 엘리먼트는 항상 같이 쓰인다.

> 의 약자 = &gt; , <의 약자 = &lt;

ex) "The <html> element rocks." => The &lt;html&gt; element rocks.

& 의 약자 = &amp;

특수 문자 사이트 : www.w3schools.com/tags/ref_entities.asp or www.unicode.org/charts

<a></a> : 링크를 만들기 위한 엘리먼트

이 엘리먼트는 여러 속성이 있는데.. 이렇게 쓰인다.

<a href=".......">......</a>

그 외에 다른 속성도 추가 시킬수 있다.

<a href="~~~ " 목적지로 이동

title=" ~~~ " 링크의 설명

id="~~" 목적지

target="~~~ " 새창으로 열기등의 속성 * 4가지 속성.. _blink _paren _self, _top

>이후 생략..

_blink : 새 창을 띄워서 보여준다.

_parent : 자신을 불렀던 부모 프레임에 보여준다.

_self : 현재 창에 보여준다.

_top : 현재 폐이지를 무시하고 전체 폐이지에 보여준다.

ex> <a href="http://www.estudy.or.kr">

<a href="story.html">

특정위치 이동시

<a href="#story1"> <a name="story1">

<a href="http://www.estudy.or.kr" target="_blink">

음악도 연결시킬수 있다.

<a href=" 음악파일의 경로">텍스트나 이미지</a>

배경음악 지정

<bgsound> : 인터넷 익스플로러 웹브라우저에서만 가능

ex> <bgsound src = "음악 파일">

<embed> : 대부분의 음악과 동영상 재생가능

ex> <embed src = "멀티미디어 파일명">

<em></em> : 강조하고자 하는 텍스트에 사용

<strong> : 특별한 강조를 위해서 사용

<pre> : 타이핑한 형식 그대로 브라우저가 보여주기 원할때 사용

사진 파일 형식

jpeg : 사진이나 복잡한 그래픽

gif : 단색이나 로고 그리고 기하학적 모양의 이미지

png : jpeg 와 gif 둘다를 지원할 수 있는 가장 최신의 기술

<img> 사진을 보여주는 엘리먼트

src : 사진을 올림, 파일 경로 지정

alt : 이미지 정보를 보여줌, 마우스를 올렸을 때, 설명글

신뢰성 검사를 위한 strict시 img 엘리먼트는 alt 속성을 반드시 가져야 한다.

align : 이미지 정렬

border : 이미지에 테두리선을 지정

width/height : 이미지의 가로/세로 길이를 지정

hspace/vspace : 이미지좌우/상하의 여백을 지정

ex> <img src="img1.jpg" alt="그림설명" align="meddle" border="1" width="300" vspace="200" >

1인치(2.54cm)는 대략 72~120픽셀

3인치(7.62cm)는 대략 220 픽셀정도..

신뢰성 검사

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

"http://www.w3.org/TR/html4/loose.dtd">

// transitional 과도적..

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"

"http://www.w3.org/TR/html4/strict.dtd">

// strict 엄격한..

메타 데이터.. <head>안에 넣어야 한다.

<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">

XML 1.0 으로의 변환

1. doctype 변환

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

2. <head> 엘리먼트에 추가

<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">

3. 모든 빈 태그들은 ">" 이 아닌 "/>"로 끝나야 한다.


<link> 엘리먼트 파일 링크해서 같다 쓰기

<link type="text/css" rel="stylesheet" href="lounge.css" />

bgcolor : 배경색을 지정 기본은 흰색

ex> <body bgcolor="yellow"> <p bgcolor="#999999">

background : 배경에 이미지를 지정

ex> <body background="images/rose.jpg">

leftmargin, topmargin : 각각 왼쪽 위쪽 여백을 지정

ex> <leftmargin="100" > <topmargin="200">

<center>~</center> : 웹화면에서 택스트나 이미지를 가운데 정렬

&nbsp; : 공백을 만들어주는 태그, 키보드의 스페이스바와 같은 효과

font : 글자를 꾸밀 수 있는 태그 속성을 모양, 색, 크기 지정

ex> <font face="MD이솝체" color="#999999" size="5" >

marquee : 글자를 움직이는 태그 속성은 방향, 속도, 배경색, 움직이는 영역의 크기, 움직이는 영역의 반복횟수(default=무한)

ex> <marquee direction="left" scrolldelay="200" bgcolor="yellow" width="200" height="200" loop="5">텍스트, 이미지</marquee>

<table> 태그의 기본 구조

<table> : 표의 시작

<tr> : 줄의 시작

<td> : 칸의 시작

</td> : 칸의 끝

</tr> : 줄의 끝

</table> : 표의 끝

<colspan="2"> 가로 셀 합치기 여기선 두개

<rowspan="2"> 세로 셀 합치기 여기도 두개

align : 행 가운데 정렬

valign : 열 가운데 정렬

width : 너비

border : 표 경계선 굵기

프레임과 프레임 셋

<frameset>

<frame>

<frame>

<frame>

...

</frameset>

프레임셋의 속성 : head와 body사이에 들어가야 한다.

cols : 화면을 좌,우 프레임으로 나눈다. 속성값 : 픽셀, 백분율값

rows : 화면을 상,하 프레임으로 나눈다. 속성값 : 픽셀, 백분율값

framespacing : 프레임안의 내용과 프레임의 여백을 지정한다. 속성값 : 숫자

frameborder : 프레임의 테두리 표시 유, 무를 지정한다. 속성값 : 보임(1), 숨김(0)

noresize : 프래임의 크기 변경불가

name : 프레임의 이름을 나타낸다.

scrolling : 프레임의 스크롤바 유/무를 나타낸다.

src : 프레임에 표시될 문서의 경로, 주소를 나타낸다.

ex> <frameset rows="30%,*">

<frame src="a.html" name = "menu">

<frame ser="b.html" name = "main" >

</frameset>

target : 연결하고자 하는 폐이지로 연결

ex> <a href="main.html" target="mainframe">...</a>

<iframe> : body에 들어가야 한다.

<iframe align="center" width="380" height="270" scrolling="no" name="photo" frameborder="0" >

<p></p> : 간단한 출력양식 단락을 구분하는 태그로 줄을 삽입한다. 정렬을 지정할 수 있다.

ex> <p align="center">

<q></q> : 인용구 - 안의 문장을 " "(쌍따옴표)로 출력해준다. 인용구를 표현할 때 쓴다. 인라인형식으로 <p>안에 있어야 한다.

<blockquote></blockquote> : 독립적으로 쓰이는 단락구분 문단표시 이걸 이용하면 이 안의 내용이 따로 블락 처리 되며 이부분은 들여쓰기가 되어진다. 긴 인용구

<br> : 줄바꿈 /n 과 같다.

<u></u> : 밑줄을 긋는다. 허나 링크연결표시랑 헷갈려서 많이 사용하지 않는다.

<hr> : 제목이 없는 새로운 구획 같은 수평선을 만들어 라인 구분, 선을 그리는 태그, 정렬, 색상, 굵기, 가로길이를 지정할 수 있다.

ex> <hr align="right" color="red" size="10" width="300" >

<li></li> : List Item 리스트 항목을 표시해주는 엘리먼트

<ol></ol> : Ordered List 리스트 항목의 순서를 표시해줌

<ul></ul> : Unordered List 리스트 항목이 순서가 필요없을때

<ol>과<ul>은 <li>와 함께 쓰인다. 그래야 의미가 있으니까.. 또한 블록 엘리먼트 이다. 실수로 <p>와 같은 인라인 엘리먼트 안에 넣지 않도록 한다.

<dl></dl> : Definition List 정의된 리스트를 표현 항목을 설명하는 부수적인 리스트를 표현할때 쓰는 엘리먼트, 사전식 목록

<dt></dt> : 정의된 리스트 안의 항목을 나타낼때, 제목

<dd></dd> : 정의된 리스트 안의 항목을 설명해주는 엘리먼트, 설명

위의 3개 엘리먼트는 항상 같이 쓰인다.

> 의 약자 = &gt; , <의 약자 = &lt;

ex) "The <html> element rocks." => The &lt;html&gt; element rocks.

& 의 약자 = &amp;

특수 문자 사이트 : www.w3schools.com/tags/ref_entities.asp or www.unicode.org/charts

<a></a> : 링크를 만들기 위한 엘리먼트

이 엘리먼트는 여러 속성이 있는데.. 이렇게 쓰인다.

<a href=".......">......</a>

그 외에 다른 속성도 추가 시킬수 있다.

<a href="~~~ " 목적지로 이동

title=" ~~~ " 링크의 설명

id="~~" 목적지

target="~~~ " 새창으로 열기등의 속성 * 4가지 속성.. _blink _paren _self, _top

>이후 생략..

_blink : 새 창을 띄워서 보여준다.

_parent : 자신을 불렀던 부모 프레임에 보여준다.

_self : 현재 창에 보여준다.

_top : 현재 폐이지를 무시하고 전체 폐이지에 보여준다.

ex> <a href="http://www.estudy.or.kr">

<a href="story.html">

특정위치 이동시

<a href="#story1"> <a name="story1">

<a href="http://www.estudy.or.kr" target="_blink">

음악도 연결시킬수 있다.

<a href=" 음악파일의 경로">텍스트나 이미지</a>

배경음악 지정

<bgsound> : 인터넷 익스플로러 웹브라우저에서만 가능

ex> <bgsound src = "음악 파일">

<embed> : 대부분의 음악과 동영상 재생가능

ex> <embed src = "멀티미디어 파일명">

<em></em> : 강조하고자 하는 텍스트에 사용

<strong> : 특별한 강조를 위해서 사용

<pre> : 타이핑한 형식 그대로 브라우저가 보여주기 원할때 사용

사진 파일 형식

jpeg : 사진이나 복잡한 그래픽

gif : 단색이나 로고 그리고 기하학적 모양의 이미지

png : jpeg 와 gif 둘다를 지원할 수 있는 가장 최신의 기술

<img> 사진을 보여주는 엘리먼트

src : 사진을 올림, 파일 경로 지정

alt : 이미지 정보를 보여줌, 마우스를 올렸을 때, 설명글

신뢰성 검사를 위한 strict시 img 엘리먼트는 alt 속성을 반드시 가져야 한다.

align : 이미지 정렬

border : 이미지에 테두리선을 지정

width/height : 이미지의 가로/세로 길이를 지정

스팸방지코드 여기를 클릭해 주세요.    새로고침     

|| 간단한 답글 달기
:   : 위의 보안코드 입력 후 (비회원)
번호 제목 작성일 조회
76
 유투브 모바일 동영상 사이즈 링크 가로세로 비율 완벽해결 [출처] 유투브 모바일 동영상 사이즈 링크 가로세로 비율 완벽해결|작성자 꿈쟁이
2017/04/09 1371
75
 SCM Music Player
2013/12/08 2267

 Html 간단한 속성
2011/08/11 7190
73
 도메인 서비스 가장 싼 업체 소개 합니다
2011/07/15 3079
72
 구글이 지원하는 "무료 웹폰트"
2011/07/14 3313
71
 무료 RSS 제공 사이트 및 소셜 네트워그 RSS 무료 포스팅 사이드 (추천)
2010/10/05 4063
70
 블로그에 SNS 공유버튼 달기, 트위터 리트윗 버튼 + 페이스북 공유하기 버튼 + AddTis 버튼 (링크)
2010/10/04 4280
69
 아이폰용 홈페이지 만드는 방법 (펌)
2010/06/03 4266
68
 HTML / CSS / Java 관련 기본 태그 설명 [1]
2009/12/17 4122
67
 HTML 문서에서 글자 세로로 쓰기
2009/11/09 3054
66
 GFlash 를 소개합니다
2009/07/24 2942
65
 좋은 폰트 하나 소개 합니다 - 우리글닷컴
2009/06/12 3115
64
 스크롤 따라 움직이는 메뉴
2007/05/03 4357
63
 웹문서에서 상 좌 우에 여백 없애는 방법
2007/01/27 4037
62
 Web에 사진 올릴 때....? [1]
2006/07/15 4622
61
 홈 주소를 누르면 창이 최대화가 되서 열리게 할려면 어떻게 해야 되나요?
2004/07/22 4887
60
 부모창 조용히 닫기와 창 최대화, 최소화 만드는 소스 입니다
2004/07/22 5621
59
 웹페이지 로딩 속도를 빨르게 하는 10가지
2004/07/22 5279
58
 swf 파일 다운받는 방법과 변환하는 방법
2004/07/22 5943
57
 스크롤 갤러리(최근게시물) 여러개에 적용시키는 Tip..
2004/07/15 3953
1 [2][3][4]

    일반 
  유투브 모바일 동영상 사이즈 링크 가로세로 비율 완벽해결 [출처] 유투브 모바... 
  SCM Music Player 
  Html 간단한 속성 
  도메인 서비스 가장 싼 업체 소개 합니다 
  구글이 지원하는 "무료 웹폰트" 
  무료 RSS 제공 사이트 및 소셜 네트워그 RSS 무료 포스팅 사이드 (추천) 
  블로그에 SNS 공유버튼 달기, 트위터 리트윗 버튼 + 페이스북 공유하기 버튼 ... 

    포토샵 
  JPG파일 여러장을 한장으로 합치기 (자동으로)  [684]
  [후보정] Adobe GAMMA 만가지고 모니터 셋팅하기 
  포토샵 젤리 스타일  [109]╋
  포토샵 100여가지의 스타일  [1]
  페이지 말린 효과를 만드는 필터 
  알아두면 유용한 73가지 포토샵팁!!  [1]
  채널의 모든것을 까발린다.  [764]╋

    Php 
  위지윅 에디터 종류  [659]
  GM 에디터 소스 
  대용량 업로드를 위한 php.ini 설정 
  사랑비 BGM 2.1  [7]
  PHP 프로그램 속도 올리는 20가지 
  업로드(upload) 구현 소스  [247]╋
  다운로드(download) 구현 소스  [764]╋

    자바 
  [script] 초간단 iframe크기 자동 조절하기  [679]
  홈페이지를 시작페이지 설정하기 소스  [1]
  날짜와 시간을 넣는 자바 소스입니다.. 
  도메인마다 다른 페이지로 연동되게 할수가 없나요?  [2]
  배너를 모자이크로 슬라이드한다!  [272]╋
  팝업창 바로 띄우기  [767]╋
  아이프레임 자동으로 늘어나는 자바 스크립트  [1]

    폰트 관련 
  무료 폰트 다운로드 / 링크 사이트. 
  조선일보 명조체 
  [무료다운로드] 웹폰트(트루타입) 23종 공개합니다. 
  이른바 "웹 폰트"를 쓰지 말아야 하는 이유 
  폰트는 FontStruct에서 만들었어요! 
  웹폰트 변환 방법 
  네이버 나눔 폰트 
    제로보드 4 
  스팸 방지 - 스팸프리 
  제로보드 4에서 한글 첨부파일 다운로드시 다운로드 안되는 현상 해결방안 
  php 4.3.x 버젼 대에서 ''정상적으로 글을 작성하여 주시기 바랍니다."  [4]
  악성스크립트, 해킹등으로 괴로움을 겪는 제로보드4 이용자님들께 [펌글] 
  config.php 파일명 변경 관련 - 보안 사항 
  특정게시판, 특정요일에 7일전 게시물 전부 삭제하기 
  일정 기간이 지난 후 게시물과 파일 자동 삭제 

    제로보드 4 FAQ 
  제로보드 4 관련 정보 
  제 홈페이지에 외부 로그인을 달고 싶습니다..  [5]
  제로보드 pl2로 업그레이드를 하려면 어떻게 하나요?  [1]
  어째서 관리자의 정보는 없나요? 자기소개에 글도 안써지고;;  [1]
  나의 계정 사용 용량을 알 수 있습니까?  [1]
  내 홈의 절대 경로 확인하는 법 
  노프레임이란?  [684]

    제로보드 4 질문 
  제로보드에 사랑비넣기  [1]
  전체쪽지 보내기 소스 좀 알려주세요ㅠㅠ  [1]
  팝업창에 대하여  [1]
  1:1게시판(상담게시판)에 관련해 문의합니다.  [1]
  질문 있습니다. 
   파일을 올립니다.  [1]
  안녕하셨어요... 질문이 또 있어서요.  [1]

    개인 서버 만들기 
  개인용 NAS 서버 구축 01, 안 쓰는 넷북으로 자작 NAS 구축하기 
  Link Shell Extension / 윈도우즈에서 심볼릭 링크 
  홈페이지 속도 떨어뜨리는 접속 통계 사이트 
  445포트(smb) 죽이고 살리기 
  445 포트 제거하기 
   port 139, 445번 이해,차단- 라우팅 및 원격 액세스 서비스 (RAS ser... 
  HP ProLiant MicroServer 사양  [1]

제 홈페이지(조은호 홈페이지)에 오신 것을 환영합니다. 이 홈페이지는 제 개인 홈페이지로 제가 직접 관리하고 있습니다.
제 홈페이지는 비영리 홈페이지이며 자료 제공만을 목적으로만 만들어진 것이 아니라, 제 개인적인 자료 정리와 관리의 목적으로
만들어졌으므로 각 메뉴마다 충분한 자료가 없을 수도 있습니다. 인터넷을 통해 수집된 것이 많으므로 그 출처를 밝혀 놓았습니다.
혹시 저작권이나 초상권에 문제가 있는 자료의 경우 연락 주시면 삭제해 드리도록 하겠습니다.
본 홈페이지에 적용된 글꼴은 윈도우즈의 '굴림'체, '우리글닷컴'의 '우리새봄', '우리돋움90c1' 체, '(주)예쁜글씨'의 '좋은_여행가는날-웹'이며 유료로 등록 사용중입니다.

본 홈페이지에 포함되거나 게시된 이메일(email)주소가 이메일 수집 프로그램이나 그 밖의 기술적 장치를 이용하여 무단으로 수집되는 것을 거부하며,
이를 위반할 경우 정보통신망 이용촉진 및 정보보호 등에 관한 법률 등 관계 법령에 의해 형사 처벌됨을 유의하기기 바랍니다.

Copyright 2002 All right reserved          This Homepage was Designed & Programmed By Cho Eunho