0
링크는 5와 10 픽셀의 패딩과 0 0 1 픽셀의(힌트 : 약식 속성 사용)의 1em sans-serif 글꼴이어야합니다. 오른쪽 테두리는 5 픽셀이어야하고 색은 #ff1828이어야합니다.이미지 위에 마우스를 가져 가면 툴팁 팝업 텍스트가 나타 납니까?
b. 사용자가 링크 위로 마우스를 가져갈 때 오른쪽 테두리는 흰색으로 5 픽셀의 스타일로 표시되어야합니다.
c. 시작할 때 파스타의 세 이미지 중 하나 아래에 텍스트가 표시되어서는 안됩니다. 호버링시 표시 텍스트 팝업을 제어하기 위해 태그를 사용하십시오. 텍스트 블록을 절대 여백으로 배치하고 상단 여백을 220 픽셀, 왼쪽 여백을 550 픽셀로 설정합니다. 연구에서 발견 한 텍스트의 양에 따라 블록의 너비는 최소한 180 픽셀이어야합니다. 5 픽셀의 여백과 10 픽셀의 여백을 사용합니다. 텍스트는 검정색 바탕에 흰색이어야합니다.
나는 모든 것을 시도해 왔으며 이것은 내가 지금까지 가지고있는 것이고 아무것도 작동하지 않는다. 내가 뭘 잘못하고 있는지 잘 모르겠다. 아무도 내가 도울 수 있다면 분명히 감사 할 것입니다. 여기 내 코드는 지금까지 있습니다 :
<!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" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Lab 7-3</title
<style type="text/css">
<!--
#links {font: 1 em sans-serif; padding: 5px 10px; margin: 0px 0px 1px, border-right: 5px color: #ff1828}
div.links:hover {border-right: double 5px; color:white}
<span>
div#sizes a:hover img.large {position: absolute; top: 220px; left: 550px;
width: 180px; border:none; padding: 5px; margin: 10px
background-color: #000000; color: #ffffff}
</span>
-->
</style>
</head>
<body>
<img src="sabatinaslogo.jpg" width="735" height="190" alt="Sabatina's logo" />
<p style="font-size: large">Hover over a photo to read about the pasta dish and its nutrition information.</p>
<div id="links" "demo">
<table style="text-align: center">
<tr>
<td>
<a><img class="picture" src="fettuccine.jpg" width="200" height="200" alt="Fettucine" title="Ingredients include:enriched durum flours, egg, water, soy lecithin. Nutritional facts: Approximately 200 calories, 3.2% total fat, 12.5% cholesterol, 16.7% protein, 1.7% calcium and 8.3% iron"/>
</td>
<td>
<a><img class="picture" src="lasagna.jpg" width="200" height="200" alt="Lasagna" title=" Ingredients include: ground beef, cheese, enriched pasta and tomato sauce. Nutritional facts: Approx. 377 calories per serving, 13% fiber, approx. 50% protein, and approx. 35% sodium" />
</td>
<td>
<a><img class="picture" src="ravioli.jpg" width="200" height="200" alt="Ravioli" title=" Ingredients include: water, durum wheat semolina, beef, wheat flour, egg, vegetable oil, salt, onion flavoring, tomatoes, sugar, cornflour, herb extracts, salt, garlic salt, spice extracts, black pepper. Nutritional facts: 2.6g of protein, 1.6g of fat, 0.8 g of fiber and 0.3g of sodium" />
</td>
</td>
</table>
</div>
</body>
</html>
을 추가하여 비교적 쉽게 달성 할 수있다 : 여기를 참조하십시오 예, 텍스트 메시지가 필요하고 브라우저에서 제공하는 기본 글꼴 및 배경 등을 신경 쓰지 않는 한 가장 간단한 방법입니다. –