태그

<div>태그가 레이아웃 관련 태그

태그 용도 ....... 분류 분할 박스 용으로 사용합니다

DIV ................ 세로 배열용 태그 이고요

SPAN ............ 가로 배열용 태그 입니다

<div> 열기태그와 닫기태그를 사용하면 됩니다 </div>

본래 DIV태그 용도가 세로 배열이므로 세로로 생성됩니다 / 자동

만약 강제로 가로배열을 하려면 강제배열 옵션을 지정해야만 됩니다 /

보통 가로배열은 SPAN 태그를 사용하면 자동으로 가로 배열이 됩니다 / 스탠다아드입니다

요즘 DIV태그 억지배열을 많이합니다 /

 

I D = 일회용, 고유명사, 중복이 불가할때 사용합니다 / 님이름도 하나죠 / =골란

CLASS = 다중용, 형용사, 무제한 반복이 필요할때 사용합니다 / 활용법도 다양합니다

 

, id="myId" 라고 한번 정해줬다면, 같은 웹페이지 내에 myId 가 또 있으면 안된다는 뜻입니다.

 

이와 다르게 class 는 여러번 사용할 수 있습니다. class="myClass" 이렇게 사용하구요.

 

class의 장점은, 여러군데 class를 지정해놓고, css를 동시에 적용할 수 있다는 점입니다.

 

좀더 자세히 알고자 하시면 아래 소스를 분석해 보시고 테스트해 보시면 됩니다.

 

모든 div의 태그의 스타일을 정의하려면

 

div{ 속성:;} 을 하시면 됩니다.

 

또는 모든 diva의 속성을 셀렉트 하려면

 

div >a { 속성:; } 또는 div p { 속성:; }

 

보통 모든 태그를 셀렉하는 *{} 값은 각각의 엘리먼트 값을 초기화 시킬때 사용합니다

 

이런식으로 해보는건 어떨까요 ?

 

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<style type="text/css">

    *{margin:0; padding:0; list-style: none;}

    a{text-decoration: none; cursor: pointer; color:#555;}

    a:hover{

        color:fuchsia;

        opacity: 0.7;

        -webkit-transition-delay:0.3s;

        -o-transition-delay:0.3s;

        -moz-transition-delay:0.3s;

        transition-delay:0.3s;

    }

    div{

        background-color:antiquewhite;

        padding:5px;

        text-align: center;

    }

</style>

</head>

 

<body>

 <div>

    연습&nbsp;: <a href="http://www.naver.com" target="_blank">네이버 바로가기</a>

 </div>

</body>

</html>

 

 

 

 

 

직장을 다니면서 투잡 ( 재택알바 / 부업 )으로 월급만큼 수익을 얻을 수 있는 곳을 소개합니다.

 

블로그 이미지

itworldkorea

IT korea가 세상(world)을 변화시킨다.

,