태그
<div>태그가 레이아웃 관련 태그
태그 용도 ....... 분류 분할 박스 용으로 사용합니다
DIV ................ 세로 배열용 태그 이고요
SPAN ............ 가로 배열용 태그 입니다
<div> 열기태그와 닫기태그를 사용하면 됩니다 </div>
본래 DIV태그 용도가 세로 배열이므로 세로로 생성됩니다 / 자동
만약 강제로 가로배열을 하려면 강제배열 옵션을 지정해야만 됩니다 /
보통 가로배열은 SPAN 태그를 사용하면 자동으로 가로 배열이 됩니다 / 스탠다아드입니다
요즘 DIV태그 억지배열을 많이합니다 /
I D = 일회용, 고유명사, 중복이 불가할때 사용합니다 / 님이름도 하나죠 / 둘=골란
CLASS = 다중용, 형용사, 무제한 반복이 필요할때 사용합니다 / 활용법도 다양합니다
즉, id="myId" 라고 한번 정해줬다면, 같은 웹페이지 내에 myId 가 또 있으면 안된다는 뜻입니다.
이와 다르게 class 는 여러번 사용할 수 있습니다. class="myClass" 이렇게 사용하구요.
class의 장점은, 여러군데 class를 지정해놓고, css를 동시에 적용할 수 있다는 점입니다.
좀더 자세히 알고자 하시면 아래 소스를 분석해 보시고 테스트해 보시면 됩니다.
모든 div의 태그의 스타일을 정의하려면
div{ 속성:값 ;} 을 하시면 됩니다.
또는 모든 div의 a의 속성을 셀렉트 하려면
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>
연습 : <a href="http://www.naver.com" target="_blank">네이버 바로가기</a>
</div>
</body>
</html>
직장을 다니면서 투잡 ( 재택알바 / 부업 )으로 월급만큼 수익을 얻을 수 있는 곳을 소개합니다.
'홈페이지제작 > CSS' 카테고리의 다른 글
| CSS강좌 / 태그에 클래스 속성을 지정하여 선택자 사용 (0) | 2017.11.14 |
|---|---|
| [CCS강좌] CSS 셀렉터(선택자) 사용하는 법 (0) | 2017.11.14 |
| [CSS3] 기초 메뉴만들기 floaat를 기반으로 (0) | 2017.09.07 |
| [CSS3 ] 여백설정하기margin, padding 값넣기 (0) | 2017.09.06 |
| [CSS3 ]배경에 관한 CSS속성 학습 (0) | 2017.09.06 |
itworldkorea
IT korea가 세상(world)을 변화시킨다.