Home > Rhymix > Html

Html Tips

홈페이지 작성시 요긴하게 사용되어지는 Html들을 정리해 놓았습니다

  1. 각종 css3를 자동으로 만들어주는 사이트

    {CSS3} animation / transform / transition 각종 css3를 자동으로 만들어주는 사이트 http://www.css3maker.com/index.html * animation 참고 사이트 http://daneden.github.io/animate.css/ - css3 animaion을 적용하기 위해선 속성 변화를 주기 위해 키프레...
    Date2017.11.07 팔공산 Views1118
    Read More

  2. html에 사용되는 Character Entities(특수기호)

    	 	 	 CHARACTER TABULATION 
 
 
 LINE FEED (LF) ! ! ! ! EXCLAMATION MARK " " " " " QUOTATION MARK # # # # NUMBER SIGN $ $ $ $ DOLLAR...
    Date2017.11.04 팔공산 Views1736
    Read More

  3. 이미지 마우스 hover시 좌우 기울이기

    아래의 이미지와 같이 마우스 hover시 좌우로 기울이는 코드 img { border:1px solid #D4D4D4; padding:5px; } img:hover{ border:1px solid #666666; filter:alpha(opacity=70); opacity:.7; box-shadow:0 0 10px rgba(0,0,0,.2);filter:alpha(opacity=100);o...
    Date2017.10.27 팔공산 Views639
    Read More

  4. 모바일웹에서 스마트폰으로 전화바로연결 코드

    모바일웹(스마트폰)에서 자동으로 전화 걸기 태그 는 아주 간단합니다 아래 코드만 입력하면 끝입니다. 스마트폰에서 터치하면 자동으로 등록된 전화번호가 키패드로 바로 보이고 거기서 통화 버튼만 누르면 된다. <a href="tel:010-1234-1234">전화걸기 여기 ...
    Date2017.06.16 팔공산 Views2458
    Read More

  6. 반응형 CSS 테이블

    이용 요금 안내 준성수기 : 7/1~7/14, 8/16~8/30 성 수 기 : 7/15~8/15 객실명 평형 입실인원 기준/최대 비수기 준성수기 7/1~7/14 8/16~8/30 성수기 7/15~8/15 101 20평 67m2 6인/10인 주중:20만 주말:23만 주중:23만 주말:26만 30만 102 10평 34m2 2인/4인 ...
    Date2017.06.13 팔공산 Views1305
    Read More

  7. 실시간 환율조회 html

    외환은행과 하나은행이 합병되면서 기존의 실시간 환율조회 html이 작동을 하지를 않아서 정상적으로 작동하는 html을 올립니다. <center><iframe frameborder="o" onload="resizeFrame(this)" scrolling="no" src="http://fx.kebhana.com/fxportal/jsp/RS/DEP...
    Date2017.04.18 팔공산 Views1597
    Read More

  8. HTML 만으로 마우스오버 구현하는 방법

    [URL링크시] <a href="#" onMouseOver="this.innerHTML='마우스오버시 변경되는 텍스트'" onMouseOut="this.innerHTML='마우스가 범위를 벗어날시 변경되는 텍스트'">기본적으로 표시되는 텍스트</a>a href = "#": 누를시 이동되는 주소를 작성하면 됩니다. 문...
    Date2017.01.07 팔공산 Reply1 Views10408
    Read More
  9. No Image

    <div> 와 같은 블록 요소를 가운데 정렬하는 방법

    1. div안에 div가운데 정렬하는 방법 <div class="container" style="text-align: center; margin: 0 auto;" > <div style="border: 1px solid; display: inline-block;"> </div> </div> 바깥 쪽 div에는 text-align과 margin값을 준다. 안에 있는 div의 displ...
    Date2016.12.26 팔공산 Reply1 Views16728
    Read More

  10. float 속성을 가진 div 100% 설정하는 방법

    css작업하다보면 간혹 곤욕스러운 경우가 많습니다. 대표적인게 float 속성인데요.. div, p 태그는 대표적인 block속성을 가지고 있는데요.. 이게 float을 만나면 inlin-block으로 속성이 변경됩니다. 만약 아래 그림처럼 레이아웃을 만들려고 하는데...box2는...
    Date2016.04.21 팔공산 Views1345
    Read More
  11. No Image

    배경이미지 슬라이드 스크립트

    <script language='JavaScript'>document.write('<st'+'yle>');document.write('body{ background-attachment:fixed; background-repeat: no-repeat;');//배경이미지고정/반복않음document.write('background-position: 0 0;}'); // 배경이미지 위치document.w...
    Date2016.04.19 팔공산 Reply1 Views2077
    Read More

  12. CSS3 border-radius 이해하기

    border-radius가 출현하면서 웹 디자이너들은 정말 열광했습니다 . 이전까지는 둥근모서리를 만들기 위해 엄청난 편법과 기법들이 난무했습니다. 이미지를 이용해서 둥근 모서리 만들기, 단순한 CSS만으로 둥근 모서리 만들기 등 둥근 모서리 박스를 만들기 위...
    Date2016.04.07 팔공산 Views490
    Read More

  14. IE 버젼별로 css 따로 적용하는 방법

    웹이 널리 보급된 이유를 개발자 입장에서 찾으라면 html, css와 같은 비교적 간단한 문법과 jsp, php, asp 같은 server-side 언어의 발전을 들 수 있을것이다. 하지만 이 모든것의 배경에는 제작과 사용을 간단하게 만든 플랫폼이 있고, 이것이 바로 웹브라우...
    Date2011.02.17 팔공산 Views13881
    Read More
  15. No Image

    마퀴태그의 기본

    - 기본속성들 설명 - marquee ☜ 마퀴태그의 기본입니다 앞에 꼭 넣어야 해요 scrollamount ☜ 빠르기지정.(숫자가 높을수록 절라빨라짐) scrolldelay ☜ 흔들리는 속성 direction ☜ 방향설정(left,right,up,down) behavior=alternate ☜ 좌우,상하왕복 loop ☜ 숫...
    Date2010.02.06 팔공산 Views10135
    Read More
  16. No Image

    이미지 바꾸기 소스

    <table align="center" cellpadding="0" cellspacing="0" width="500"><tr><td><SCRIPT> // "이미지는 바꾸어서 쓰세요" var slideshow=new Array("http://pds12.egloos.com/pds/200906/06/18/a0102518_4a29fe104c7e8.jpg| &nbsp;&nbsp;&nbsp;&nbsp;이미지설명...
    Date2009.06.06 감로수 Reply1 Views10364
    Read More
  17. No Image

    익스6에서만 작동되게하는 css구문

    <!--[if lt IE 6]> <!--%import("css/default-ie.css")--><![endif]-->위의 문구는 ie6에서만 작동하는 css파일을 지정할때 사용하는 방법입니다.#gnb { position:absolute; top:0px; right:140px; _right:155px; font:11px arial, sans-serif; overflow:hidde...
    Date2009.02.19 팔공산 Views9882
    Read More
  18. No Image

    CSS 기초 깨우치기

    css 속성 설명 사용 예 font-family 글꼴을 설정합니다. {font-family:굴림,돋움} font-size 글꼴의 크기를 지정합니다 {font-size:12pt} font-style 글꼴의 스타일을 지정합니다 {font-style:ifalic} font-weight 글꼴의 두께를 지정합니다 {font-weight:bold...
    Date2008.10.12 팔공산 Reply1 Views9306
    Read More

  20. CSS 사용시 익스플로러 버그 해결하기

    보통 CSS를 사용하면 파폭, 사파리, 오페라에서는 잘 보이는데 IE에서는 깨진다거나 IE7까지는 맞출 수 있지만 IE6까지 맞출 방법이 없다거나 그렇다고 IE6에다 맞추면 다른 브라우저에서 전부 깨져보인다던가 하는 난감한 일이 발생합니다. 그런 경우를 위한 ...
    Date2008.07.19 팔공산 Views8860
    Read More

  21. CSS : 글꼴과 텍스트(2) - 장식과 자간 및 줄간

    글꼴의 종류와 크기를 결정했다면, 볼드/이텔릭과 같은 글꼴의 장식 및 자간, 줄간 들여쓰기와 같은 문단 편집기능에 대하여 살펴봅니다. 몇몇 기능은 브라우저에 따라, 적용/미적용 여부가 다르며, 적용되더라도 화면의 보여지는 모습이 다릅니다. 충분한 테...
    Date2008.07.19 팔공산 Reply1 Views12927
    Read More
  22. No Image

    기본적인 태그 (링크걸기)|

    <a href="주소">표시할 글자</a> 위처럼 태그를 넣으면 보이는건 표시할글자 내용이고 그글자를 누르면 써넣은 주소로 이동이 됩니다 예)글자색과 링크 시키는 방법(target)을 덧 붙이면 아래 방법으로 넣으면 되겠죠 <a href="주소" target="_blank">홈으로</...
    Date2008.07.12 팔공산 Reply1 Views9172
    Read More
  23. No Image

    가장 기본적인 태그들

    1. 홈페이지 태그 ※ 그림 관련 태그 <IMG> 그림을 삽입하기 위한 태그 <IMG SRC="파일명" BORDER=n> 그림을 나타나게함.테두리선은 n값 <IMG SRC="파일명" BORDER=0 WIDTH=n HEIGHT=n> 그림의 넓이와 높이를 지정 <IMG SRC="파일명" ALT="그림설명"ALIGN=LEFT,...
    Date2008.07.12 팔공산 Views6998
    Read More
List
Write
Board Pagination Prev 1 2 3 4 Next
/ 4