링크 스타일이 작동하지 않습니다.

Question

좋아, 이제 링크에 테두리가 있어야합니다.

<div class="intro">jfskdlq kflsdq jklfjsqd <a href="google.be" title="website" target="_blank">website</a></div><p>jqskdlfjklqsjklmqjfkdlksqlmlmdfsqlmqsdf</p> 

.intro { 
    line-height: 27px; 
    padding: 7px 16px 7px 16px; 
    margin-bottom: 6px; 
    letter-spacing: 2px; 
    background: #cfffef; 
    font-size: 11px; 
    font-family: 'OpenSansRegular'; 
    text-transform: uppercase; 
} 

.intro a, .intro a:visited { 
    color: #cccccc; 
    border-bottom: 1px #ffffff; 
} 

단, 색상 : #CCCCCC 쇼가 아닌 국경 바닥

이 내 코드입니다. 내가 도대체 ​​뭘 잘못하고있는 겁니까? border-style의 기본값이 none 때문에

Answer 1

border-bottom: 1px #ffffff; 

이 아무것도 표시되지 않습니다.

따라서 실제로 결과를보고 싶다면 스타일을 적용하고 싶을 것입니다.

다음은 예입니다 :

border-bottom: 1px solid #ffffff; 

나는 예를 border-style로 solid을 사용하고 있지만, a range of styles에서 하나가 될 수 있습니다.

border-bottom 약식 here에 대해 자세히 알아보십시오.

여기에 당신은 아마 당신의 국경 아래 규칙에 테두리 스타일 (즉, 고체 등)을 추가 할 jsFiddle.

Answer 2

입니다.

Answer 3

어때 대략 text-decoration: underline?

solid을 사용하여 선언에 추가하면 괜찮습니다.하지만 텍스트를 만들 때는 (앵커 링크가있는 것처럼) 밑줄을 사용하고 싶습니다.

테두리 아래쪽은 텍스트의 바깥 상자에만 적용됩니다. 따라서 텍스트 단락이있는 경우 가장 마지막 줄의 텍스트 만 "테두리가있는"반면 밑줄은 모든 텍스트에 테두리를 만듭니다. 하하 덕분에 저 정말 바보 같았

코드 개정

.intro a, .intro a:visited { 
    color: #cccccc; 
    text-decoration: underline; 
}