2019/03/14 - [각 종 it/티스토리 등 프로그래밍] - html style 지정 시 왜 css을 사용 할까? & 간단한 css 사용법
지난 번에 css 간단 사용법에 대해 언급 한 적이 있다.
그런 의미에서 다음이나 티스토리에서 제공하는 기능인 더보기를 꾸미기로 한다.
보통 티스토리에서 제공하는 기본 스킨에서는 더보기 옆에 아래 화살표를 표시하거나 해서 더보기라는 티를 내주는데,
이번 스킨은 그림을 강조하는데 중점을 두었는지 글자들은 참 눈에 띄지 않는다.
그리하야 한동안은 웹텍스트를 깜빡이게도 해 보았다.
만든 이는 알지만 모르는 이는 모른다.(필자도 가끔 깜빡하고 그냥 지나친다.)
그래서 이번에는 글자 색깔을 바꾸기로 했지만,
어딘가에 css의 저주(span과 관련 색 지정)에 걸려져 있어 풀려고 하니... 뭔가 잔뜩 풀릴 것 같아 포기한다.
전체적인 디자인이 거진 다 relative라 이걸 풀면 뭔가 장난이 아닐 것 같았다.
이로 인해 <span>과 관련한 글자크기, 색깔은 바꾸지 못하게 되었다.
그럼... stroke를 적용하지 뭐.
stroke는 텍스트 외관에 색깔을 넣는 css(디자인)다.
이렇게 비록 속은 검은 색이지만, 겉에 색깔을 넣으면 얼추 눈에 띄는 색깔이 된다.
여기다 앞에 이미지를 넣으니 괜찮은 디자인이 나왔다.
stroke css는
-webkit-text-stroke: 글자두께 글자색깔코드
글자 앞뒤로 이미지 또는 글자를 넣는 css는
.moreless_fold:before{
content:url("");
}
이고 그냥 글자를 넣고 싶다면, url() 대신, "글자"를 집어 넣으면 된다. 자세히 보면 ': before'이라 되어 있는데, 이는 앞에 웹글자 앞에 이미지나 글자를 넣는다는 뜻이고, ':after'는 당연히 웹글자 뒤에 이미지나 글자를 놓는다는 의미다.
#태양광 상담은(010-2668-3897)...
RECENT COMMENT