초보자들은 도움을 요청하고 같은 직선에 있는 두 개의 삼각형을 요청합니다. 잘못된 곳을 찾았다. (탐색 종료)

네가 나한테 암시한 적 없다는 거 알아 · 게시됨 2014. 12. 3. 오후 9:38:51

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>제목 없는 문서</title>
<style type="text/css">
*{패딩:0px; 마진:0px; }
#box{너비:200px; 높이: 200px; 여백-오른쪽: 자동; 여백-왼쪽:자동; 텍스트-정렬:센터; }
#box a, #box a:visited {text-decoration: none; 색상: #333; display:block; }
#box a:hover {color: #F00; }
#box a:hover span{ display:block; 위치:절대; width:0; 높이:0; border: 단단한 8px #FFFFFF; }
#box a:hover span.z{ border-left-color:#F00; }
#box a:hover span.y{ border-right-color:#FF0000; }
</style>
</head>
<body>
<div id=box>
<a href="#"><span class="z"></span>dsad <span class="y"></span></a>
</div>

</body>
</html>

네가 나한테 암시한 적 없다는 거 알아 · 게시됨 2014. 12. 3. 오후 11:20:12

관리자, 2014-12-3 23:17에 게시됨
네 삼각관계가 뭔지 모르겠어

삼각형은 경간 경계로 좁혀져 있어, 선생님 표준 코드를 내놓을게요
[mw_shl_code=html, true]
<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
            "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

         <style>

#menu { /*메뉴 레이어 설정*/
폰트-패밀리: Arial;                               /*폰트*/
font-size:16px;                               /*글꼴 크기*/
너비: 140px;                               /*너비*/
마진:0 자동;                               /*메뉴 항목 사이와 가로 중앙 간 0.5em*/
border:solid 1px #ccc;                      /*회색 얇은 테두리*/
}

#menu, #menu a:visited {
  텍스트-장식:없음;                      /*텍스트에 밑줄이 안 붙어 있습니다*/
  텍스트-정렬:센터;                               /*텍스트가 가로 중앙에 정렬되어 있습니다*/
  색상:#c00;                                        /*빨간 텍스트*/
  display:block;                               /*블록 레벨 요소로 설정*/
  패딩: 4px;                                     /*여백*/
  배경색:#fff;                      /*배경색*/
  국경: 단단한 1px #fff;                      /*점프를 방지하기 위해 배경색과 같은 테두리*/
  위치: 상대;                               /*상대 위치 사용*/
  너비:130px;
  }

#menu span {
  display:없음;
}

#menu a:hover {
  테두리-컬러:#c00;                               /*국경색 빨간색*/
}

#menu a:hover span {
      display:block;             /*블록 레벨 요소로 설정*/
  위치:절대;                               /*절대 위치 사용*/
  높이:0;                                        /*키는 0*/
  width:0;                                        /*0*너비는 0*/
  경계: 단단한 8px #fff;                      /*기본 테두리 스타일 설정*/
  상단: 4px;                                     /*수직 위치 지정*/
  overflow:hidden;
  }

  #menu a:hover span.left {
  border-left-color:#c00;
  왼쪽: 8px;
  }

  #menu a:hover span.right {
  border-right-color:#c00;
  오른쪽: 8px;
  }

</style>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>arrow menu</title></head>

<body>
<div id="menu">
   <a href="#">
            <span class="left"></span> menu item 1<span class="right"></span> </a>
   <a href="#">
            <span class="left"></span> 메뉴 항목 2</a>
   <a href="#">
                        <span class="left"></span> 메뉴 항목 3<span class="right"></span> </a>
   <a href="#">
                     <span class="left"></span> 메뉴 항목 4<span class="right"></span> </a>
   <a href="#">
                        <span class="left"></span> 메뉴 항목 5</a> </div>
</body>
</html>
[/mw_shl_code]

관리자 · 게시됨 2014. 12. 3. 오후 11:17:49

분명히 나한테 힌트를 주지 않았네요. 2014-12-3 22:38에 게시됨
삼각형이 내용을 차단하는데, 간격을 조절하는 방법도 알려줍니다. 간격을 조정하면 절대 위치 조정이 됩니다

네 삼각관계가 뭔지 모르겠어
[mw_shl_code=html, true]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>제목 없는 문서</title>
<style type="text/css">
*{패딩:0px; 마진:0px; }
#box a{border: 1px 솔리드 #666; }
#box{너비:250px; 높이: 200px; 여백-오른쪽: 자동; 여백-왼쪽:자동; 텍스트-정렬:센터; border:solid 1px #999999; }
#box a, #box a:visited {text-decoration: none; 색상: #333; display:block; }
#box a:hover span{ position:relative; border:solid 1px #FFFFFF; 패딩-레프트:20px}
#box a:hover{ border:solid 2px #FF0000}
#box a:hover span.z{ border-left-color:#F00; }
#box a:hover span.y{ border-right-color:#FF0000; }
</style>
</head>
<body>
<div id=box>
<a href="#"><span class="z"></span> 이것은 첫 번째 <span 클래스 = "y" ></span></a>
<A href="#"><span class="z"></span> 이것은 두 번째 <span class="y"입니다></span></a>
<a href="#"><span class="z"></span> 이것은 세 번째 <span 클래스="y"입니다></span></a>
<A href="#"><span class="z"></span> 이것은 네 번째 <span class="y"입니다></span></a>
<A href="#"><span class="z"></span> 이것은 다섯 번째 <span class="y"입니다></span></a>
<a href="#"><span class="z"></span> 이는 여섯 번째 <span class="y"입니다></span></a>
</div>

</body>
</html>
[/mw_shl_code]

네가 나한테 암시한 적 없다는 거 알아 · 게시됨 2014. 12. 3. 오후 11:17:07

[mw_shl_code=html,,true] <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>제목 없는 문서</title>
<style type="text/css">
*{패딩:0px; 마진:0px; }
#box a{border: 1px 솔리드 #666; }
#box{너비:200px; 높이: 200px; 여백-오른쪽: 자동; 여백-왼쪽:자동; 텍스트-정렬:센터; border:solid 1px #999999; }
#box a, #box a:visited {text-decoration: none; 색상: #333; display:block; }
#box a:hover span{ position:absolute; width:0; 높이:0; border: 단단한 8px #FFFFFF; }
#box a:hover{ border:solid 2px #FF0000}
#box a:hover span.z{ border-left-color:#F00; }
#box a:hover span.y{ border-right-color:#FF0000; }
</style>
</head>
<body>
<div id=box>
<a href="#"><span class="z"></span> 이것은 첫 번째 <span 클래스 = "y" ></span></a>
<A href="#"><span class="z"></span> 이것은 두 번째 <span class="y"입니다></span></a>
<a href="#"><span class="z"></span> 이것은 세 번째 <span 클래스="y"입니다></span></a>
<A href="#"><span class="z"></span> 이것은 네 번째 <span class="y"입니다></span></a>
<A href="#"><span class="z"></span> 이것은 다섯 번째 <span class="y"입니다></span></a>
<a href="#"><span class="z"></span> 이는 여섯 번째 <span class="y"입니다></span></a>
</div>

</body>
</html>
[/mw_shl_code]

네가 나한테 암시한 적 없다는 거 알아 · 게시됨 2014. 12. 3. 오후 9:40:28

관리자 · 게시됨 2014. 12. 3. 오후 10:12:27

Put:display:block; 제거하면 문제가 해결됩니다!
올바른 코드:

[mw_shl_code=html, true] <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>제목 없는 문서</title>
<style type="text/css">
*{패딩:0px; 마진:0px; }
#box{너비:200px; 높이: 200px; 여백-오른쪽: 자동; 여백-왼쪽:자동; 텍스트-정렬:센터; }
#box a, #box a:visited {text-decoration: none; 색상: #333; display:block; }
#box a:hover {color: #F00; }
#box a:hover span{ position:absolute; width:0; 높이:0; border: 단단한 8px #FFFFFF; }
#box a:hover span.z{ border-left-color:#F00; }
#box a:hover span.y{ border-right-color:#FF0000; }
</style>
</head>
<body>
<div id=box>
<a href="#"><span class="z"></span>dsad <span class="y"></span></a>
</div>

</body>
</html>
[/mw_shl_code]

네가 나한테 암시한 적 없다는 거 알아 · 게시됨 2014. 12. 3. 오후 10:15:06

관리자가 2014-12-3 22:12에 게시됨
Put:display:block; 제거하면 문제가 해결됩니다!
올바른 코드:

굉장한!

말벌 · 게시됨 2014. 12. 3. 오후 10:16:26

display:block 此元素将显示为块级元素，此元素前后会带有换行符。

그래서 다른 삼각형이 자동으로 선을 감아줍니다

네가 나한테 암시한 적 없다는 거 알아 · 게시됨 2014. 12. 3. 오후 10:17:56

Wasp 2014-12-3 22:16에 게시됨
display:block 此元素将显示为块级元素，此元素前后会带有换行符。

그래서 다른 삼각형이 자동으로 선을 감아줍니다

그들 각자는 강력한 인물이며, 앞으로 문제가 생기면 여기에 게시될 것입니다. 도와주신 모든 분들께 감사드립니다

네가 나한테 암시한 적 없다는 거 알아 · 게시됨 2014. 12. 3. 오후 10:18:04

정말 고마워요

네가 나한테 암시한 적 없다는 거 알아 · 게시됨 2014. 12. 3. 오후 10:36:11

다시 한 번 질문이 제기됩니다. [mw_shl_code=html, true] <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>제목 없는 문서</title>
<style type="text/css">
*{패딩:0px; 마진:0px; }
#box{너비:200px; 높이: 200px; 여백-오른쪽: 자동; 여백-왼쪽:자동; 텍스트-정렬:센터; }
#box a, #box a:visited {text-decoration: none; 색상: #333; display:block; }
#box a:hover {color: #F00; 테두리: 단단한 2px #FF0000; }
#box a:hover span{ position:absolute; width:0; 높이:0; border: 단단한 8px #FFFFFF; }
#box a:hover span.z{ border-left-color:#F00; }
#box a:hover span.y{ border-right-color:#FF0000; }
</style>
</head>
<body>
<div id=box>
<a href="#"><span class="z"></span>1<span class="y"></span></a>
<a href="#"><span class="z"></span>2<span class="y"></span></a>
<a href="#"><span class="z"></span>3<span class="y"></span></a>
<a href="#"><span class="z"></span>4<span class="y"></span></a>
<A href="#"><span class="z"></span>5<span class="y"></span></a>
<a href="#"><span class="z"></span>6<span class="y"></span></a>
</div>

</body>
[/</html>mw_shl_code]

네가 나한테 암시한 적 없다는 거 알아 · 게시됨 2014. 12. 3. 오후 10:38:34

삼각형이 내용을 차단하는데, 간격을 조절하는 방법도 알려줍니다. 간격을 조정하면 절대 위치 조정이 됩니다

Delver_Si · 게시됨 2014. 12. 3. 오후 10:53:13

분명히 나한테 힌트를 주지 않았네요. 2014-12-3 22:38에 게시됨
삼각형이 내용을 차단하는데, 간격을 조절하는 방법도 알려줍니다. 간격을 조정하면 절대 위치 조정이 됩니다

도움이 되지 않을 거예요

[CSS/DIV] 초보자들은 도움을 요청하고 같은 직선에 있는 두 개의 삼각형을 요청합니다. 잘못된 곳을 찾았다. (탐색 종료)

본 섹션