처음 올려봅니다.
예쁘진 않은듯한데 ^^ 사용하실분 있으시거나, 웹 표준 공부하시는 분들께 도움이 되었으면 합니다.
크로스 브라우징: IE6,7,8 / 파이어폭스 / 오페라 / 사파리 / 크롬
예쁘진 않은듯한데 ^^ 사용하실분 있으시거나, 웹 표준 공부하시는 분들께 도움이 되었으면 합니다.
크로스 브라우징: IE6,7,8 / 파이어폭스 / 오페라 / 사파리 / 크롬
첨부파일
|
댓글을 작성하시려면 로그인이 필요합니다.
댓글 15개
Fatal error: Call to undefined function latest() in 어쩌고...에러가 맞죠?
꾸벅~꾸벅~ 감사합니다
<h3></h3>
<li><?=$list[$i]['subject']?> <span class="date"></span></li>
<p class="button"></p>
</ul>
div로 둘러싸지 않는게 좋을것같네요
more가 없다면 궂이 div가 없어도 되겠지만, more가 추가가 되었기때문에 div로 감싸야합니다.
.button{position:absolute; top:10px; right:10px;}
저는 이렇게 사용하고 있습니다.
<ul>
<h3></h3>
<li><?=$list[$i]['subject']?> <span class="date"></span></li>
<p class="button"></p>
</ul>
이러한 형태를 계속 말씀하시는듯한데
UL은 리스트형의 구조만을 작성한것이고, P는 별개의 엘리먼트이기때문에
따로 분류해서 마크업하였습니다.
웹 표준은 UL, OL, DIV, P, DL 등만 사용한다해서 웹표준이 아닙니다.
또한 불필요하게 클래스와 , 아이디를 남발할필요없구요
지정된 아이디에 태그만을 조절해도 얼마든지 원하는 배치가 이루어지게됩니다.
웹 표준은 의미있는 마크업입니다.
리스트에 해당하는것은 최근게시물의 게시판 제목에 해당하는 부분이므로
LI속성에 맞추어 작성된것이고, more에 해당하는 부분은 해당 게시물들을
더보기위한 별도의 버튼에 해당하는 엘리먼트 입니다.
그렇기때문에 more를 조절하기위해 최근게시물에 해당하는것을 전부 감싸고
배치할수있는 div가 생성된것이랍니다.
또한 의미있는 마크업의 필요성은 웹 접근성과 밀접한 관계가 있습니다.
스크린리더기로 읽어드릴때의 순서에도 많은 영향이 있기때문이죠,
접근성은 장애인이나, 노약자등 웹 환경에 익숙치 않거나 정상인들과 같이 이용이 힘든 사람들을 위해 웹 환경을 만들어내는 작업입니다.
글자의 색상을 바꾼다던지, 글자의 크기를 조절 할 수 있다던지, 간단한예로 이미지가 있다면 이미지를 대체할 수 있는 텍스트를 alt="NAME" 으로 넣어주는 정도가 되겠네요, 또한 FLASH 를 사용하여 네비게이션이 구성되었다면 음성 기능 정도는 기본적으로 사용되어져야겠지요.
그러한 환경을 조금더 쉽게 만들어 낼 수 있는것또한 웹 표준에 해당합니다.
제꺼도 div로 싸줘야 할것 같네여
한수 배워갑니다.^^