Site icon 엘스트림

HTML 스터디

– 접근성.

접근성을 위한 링크 내에 타이틀을 포함하는 방법.

<a title=”some words” href=”link”>SS</a>

접근성은 시각장애인을 위한 브라우저에서 읽어준다.

또한 링크 위에 위치했을 때 툴팁을 보여 준다.

페이스북이 이 툴팁을 멋지게 해킹해서 사용하는 듯 한다.

 

– css

 

스타일 태그의 위치는

<head> </head> 이 사이 이다. 다음과 같은 양식을 사용한다.

<style type=”text/css”>
body {
font: small sans-serif;
}
img {
border: none;
}
#logo {
width: 538px;
height: 217px;
}
#content {
margin: auto;
width: 75%;
}
#footer {
text-align: center;
}
a, a:link, a:visited, a:hover, a:active {
text-decoration: none;
color: #000000;
}
a.wiki, a.wiki:link, a.wiki:visited, a.wiki:hover, a.wiki:active {
text-decoration: underline;
color: #737373;
}
</style>

 

– 목적지 앵커와 연결하기.

페이지 내에서 특정 페이지로 이동하기 원할 때는 <a> 엘리먼트의 속성을 이용한다.

먼저 목적지 앵커를 만든다.

1. 도착하고자 하는 부분을 <a> 엘리먼트로 감싼다.

<a>이곳으로 착륙</a>

2. <a> 엘리먼트에 id를 부과한다.

<a id=”here”>이곳으로 착륙</a>

3. 출발 링크를 만든다. # + id 로 도착지를 지정한다.

<a href=”#here”>이곳에서</a>

4. 이제 출발 링크를 만들면 도착 링크로 워프~

 

Exit mobile version