programming/HTML&CSS
-
[HTML&CSS] 아이폰에서 display:none이 안될때programming/HTML&CSS 2019. 9. 26. 22:57
정확히 말하면 사파리 모바일에서 작동이 잘 안 되는 것 같다. -PC나 아이폰의 다른 브라우저에선 확인을 해보지 않았다. 좀 더 확인이 필요한 부분이긴 한데, 일단 체험한 것 을 적어놓는다. 아이폰의 사파리에서 style의 "display:none" 속성이 제대로 작동하지 않았다. 안드로이드에선 물론 작동이 잘되었고, 같이 확인하던 중 안되는 걸 알았다. 그래서 찾아보니, "visibility:hidden" 속성으로 비슷한 동작 처리를 할 수가 있었다. 여기서, display:none과, visibility:hidden의 차이가 정확히 뭔지 짚고 넘어가자. 한 image태그를 예로 들면, "display:none" 속성으로 쓰면 이미지가 안보이는것은 똑같은데, 아예 차지하고 있던 공간도 사라진다. "vi..
-
[HTML&CSS] a tag의 href="#" 의미programming/HTML&CSS 2019. 9. 22. 23:48
홈페이지에서 링크를 걸 때 href="#id"의 형식으로 걸어서 해당 id 위치로 이동할 수 있다. 그리고, a tag를 사용하지만, onclick을 사용해서 다른 작동을 하거나, 단순 a의 스타일을 따를 때 href="#"의 형태를 사용할 때 가 있다. test 의 형식으로 사용할 때 가 있는데, 이때 id가 없으면 페이지 내에서의 이동이 발생하지 않을 것 같지만, 원래 페이지에서 이동이 발생한다. 그래서 페이지내에서 이동을 막기 위해선 1. href="#;"의 형식으로 작성한다. 2. href="javascript;"의 형식으로 작성한다. 2. href="javascript:;"의 형식으로 작성한다. (*** ":"이 빠졌습니다. 2019-10-18 수정) 두 가지 방법의 차이는 url에 "#"가 붙..
-
[HTML&CSS] 게시판 형식 그대로 유지하기 (white-space:pre-wrap)programming/HTML&CSS 2019. 8. 8. 22:24
https://leeborn.tistory.com/11 게시판 형식 그대로 유지하기 게시판을 만들어서 DB에 저장하고 불러오기는 어렵지 않다. textarea나 input text에서 값을 저장하면 된다. 이때 db에 저장될때 html 태그로 저장할 수 도 있고, text만 그대로 저장할 수 도 있다. 태그들을 그대.. leeborn.tistory.com 위 글에서 white-space의 속성에 대해서 pre에 대해서만 사용했었는데, pre를 사용하면 공백 등은 그대로 표시해주지만 줄 바꿈을 해주지 않는다. 가장 첫번쨰 white-space:pre 와 같이 공백 등은 그대로 표시해주지만, 긴 글들은 div를 넘어 간다. 이때 white-space:pre-wrap 속성을 쓰면 자동 줄 바꿈도 된다. 그리고..
-
[HTML&CSS] 게시판 형식 그대로 유지하기(white-space:pre)programming/HTML&CSS 2019. 7. 28. 18:03
게시판을 만들어서 DB에 저장하고 불러오기는 어렵지 않다. textarea나 input text에서 값을 저장하면 된다. 이때 db에 저장될 때 html 태그로 저장할 수 도 있고, text만 그대로 저장할 수 도 있다. 태그들을 그대로 저장했을 경우에 다시 화면에 불러와줄땐 다르게 보일 수도 있다. 예를 들어, hello world!! 아래와 같은 형식이 있을 때, helloworld!!로 출력할 것인가 hello world!! 의 형식으로 출력할 것인가 할 때 hello world!! hello world!! 의 형식으로 쓴다면 입력했던 그대로 표시해줄 수 있다.