테스트 사이트 - 개발 중인 베타 버전입니다

css 초보자의 질문입니다.

· 12년 전 · 945 · 11
그누4 질답게시판하고는 성격이 틀린것같아 이곳에 질문을 올립니다.
문제가 된다면 이동 또는 자삭하도록 하겠습니다.


최근에 css의 필요성을 느껴서 공부를 좀 해보려고 하는데요
아래와 같이 간단하게 좀 꾸며서 마우스오버시 색깔도 좀 변하게 하고 싶은데
이 간단한것도 의문점이 두가지가 생겨서 문의 드립니다.

1. ul 부분 "서울시" 이 칸에 속성을 height=30 으로 줘도 마우스를 올리면 딱 글자부분만큼의 높이만
   빨간색이 물듭니다. 어떻게 바꿔줘야 하나요?

2. 크롬에선 소스가 잘됩니다. 하지만 익스8에선 마우스오버효과라던지 구조모양이 조금 바뀝니다.
    이건 어디서부터 시작해야하는건지요?
-------------------------------------------------
<html>
<head>
<title></title>
<style>
.irum {font :bold 11px '돋움'; float:left; margin:0 0 0 2px;}
.irum a:hover {color: red;}
.menu {text-align:left;}
.menu:hover {background:red;}
.box {width:150px; height:30px; border: 2px solid black; padding:10px; line-height:300%; margin:0 0 2 0;}
.box:hover {background:#D0E3FE; border:2px solid #176BEA; }
</style>
</head>
<body>
<div class="irum">
<ul class="menu">서울시</ul>
<li class="box"><a href=#>영등포구</a></li>
<li class="box"><a href=#>문래동</a></li>
<li class="box"><a href=#>개인및단체</a></li>
<li class="box"><a href=#>이현옥</a></li>
</div>
<div class="irum">
<ul class="menu">서울시</ul>
<li class="box"><a href=#>영등포구</a></li>
<li class="box"><a href=#>문래동</a></li>
<li class="box"><a href=#>개인및단체</a></li>
<li class="box"><a href=#>이현옥</a></li>
</div>
<div class="irum">
<ul class="menu">서울시</ul>
<li class="box"><a href=#>영등포구</a></li>
<li class="box"><a href=#>문래동</a></li>
<li class="box"><a href=#>개인및단체</a></li>
<li class="box"><a href=#>이현옥</a></li>
</div>
<div class="irum">
<ul class="menu">서울시</ul>
<li class="box"><a href=#>영등포구</a></li>
<li class="box"><a href=#>문래동</a></li>
<li class="box"><a href=#>개인및단체</a></li>
<li class="box"><a href=#>이현옥</a></li>
</div>
</body>
</html>

댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

댓글 11개

11년 전
와우~~ 진짜 여기 싸이트는 친절한분들이 많아요~^^

게시글 목록

번호 제목
7405
7401
7398
7392
7385
7373
7370
7365
7359
6754
6750
6740
9068
9055
6729
6709
6701
6698
6696
6685
6681
6679
6671
7338
6666
6658
6644
6631
6619
6602
6597
6590
6579
6573
6568
6565
6564
6559
6554
6553
6550
6543
6540
6538
6536
6531
6529
6515
6511
6507
6504
6499
6493
6492
6481
6470
7316
6468
6465
6462
6458
6456
6442
6437
6432
7281
6427
6424
6419
6411
6404
6394
6392
6380
6375
6372
6369
6365
6360
6357
6352
6349
6345
7261
6331
6328
6327
6323
6318
6314
6311
6306
6300
6292
6291
6288
6272
6270
6260
6258