[html5] - 형광펜 효과 , - 텍스트 영역 감싸 스타일 적용

티스토리 뷰

[개발]프로그래밍/html5

좋은 블로그 2020. 12. 31. 00:00

1. 개념

- 형광펜 효과 , - 텍스트 영역 감싸기

: 태그로 감싼 부분의 배경색을 노란색이 되어 형광펜으로색칠한 효과를 줌

: span 태그로 감싼 텍스트에 스타일을 적용하려고 할 때사용

2. 태그

,

html5 코드

<! DOCTYPE html>

<head>

</head>

<body>

형광펜 효과를 내는 mark태그 입니다.

span 태그입니다. 아무런 의미가 없지만 이 부분만 감싸서 스타일을 낼 수 있습니다.

</body>

</html>

결과 화면

코드 설명

......

mark 태그를 감싸게 되면 자동으로 배경색이 노란색으로 되면서 형광펜으로 그은 듯한 효과를 줍니다.
만약에 노란색이 아닌 다른 색으로 하고 싶다고 하면 background-color:로 스타일을 설정하여서 다른 색으로도 설정이 가능합니다.

......

span은 이 태그는 자체적으로는 의미가 없습니다.
근데 이 태그가 좋은 것은 줄바꿈 없이 일부 텍스트를 감싸서 스타일을 줄 때 아주 유용합니다.
저도 블로그를 작성할 때 이 태그 많이 이용합니다.
기본적인 태그이면서도 활용도가 높은 태그입니다

공지사항

최근에 올라온 글

최근에 달린 댓글