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

css 초보자의 질문입니다.

· 12년 전 · 926 · 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년 전
와우~~ 진짜 여기 싸이트는 친절한분들이 많아요~^^

게시글 목록

번호 제목
7104
7102
5000
4999
4991
4989
4985
7099
11179
레이아웃 습작 1
4979
4974
11178
4972
7094
4960
11169
11165
11164
11163
11162
4948
6002
7090
4941
7087
7082
7079
7076
11136
11158
11135
4937
4931
4930
4928
4925
4914
7074
7072
4913
4912
4906
4902
4897
4895
4889
4888
4887
4886
4882
4880
4876
4873
4872
4863
4862
4857
4852
5998
11256
4849
4837
4825
4820
4815
4814
4807
4796
7070
7068
4789
4778
4772
4769
4758
4755
4751
4743
7063
7061
4741
4740
4735
4732
4721
4718
7059
4715
4710
4709
4707
4699
11254
4691
4688
11133
11127
4682
7057
4678