지지나

완전 간단한 css display와 visibility 속성에 대해서 알아보자. display 속성은 크게 none, inline, block, inline-block가 있으며 각각의 의미는 이렇다; display: none → 요소가 완전히 사라짐 display: inline → 인라인 성격으로 바뀜. 크기를 가질 수 없고, 세로로 쌓이지 않고 가로로 나열됨. display: block → 블록 성격으로 바뀜. 아래로 쌓임. display: inline-block → 크기는 가질 수 있지만 세로로 쌓이지 않고 가로로 나열됨. visibility는 화면에 어떻게 보이는지를 설명하며, hidden으로 하게 되면 요소는 보이지 않지만 요소의 자리는 그대로 유지한다. 백문이 불여일견인지라, 직접 해서 눈으로 ..

바로 앞 포스팅에서 웹사이트 상단 로고와 메뉴바를 만들었는데, 이번엔 그것의 심화버전이다. 이번에는 귀찮으니 다 텍스트로 하고, 좀 더 심화해 다룰 내용에 초점을 맞출 예정이다. 보통 로고나 메뉴박스를 선택하면 어떠한 특정 링크로 연결이 되는데(메인 화면 등), 태그를 이용해서 링크연결을 하면 글자가 자동적으로 파란색에 밑줄이 그어져서 나온다. 이것은 a태그에 파란글자, 언더바 초기화를 text-decoration:none이라는 속성으로 해주면 된다. 그럼 이제 로고는 화면 왼쪽에, 메뉴박스는 오른쪽에 배치해 보자. 여기까지 배치하는 방법은 앞 포스팅에서 다루었으므로 생략한다. 프로그래밍 한 것은 다음과 같다ㅎㅎ 그리고 html에서 semantic 태그를 잘 다루는 것이 중요한데, 는 로고와 주메뉴를 아..

어느덧 국비지원으로 재직자 html/css 수업을 들은지 3주차이다. 짧은 시간이지만 그래도 3주 전의 나와 비교하면 정말 많은 것을 배웠다. 아는만큼 보인다고, 지금은 로그인 페이지나 사이트를 가면 '저것은 00태그를 이용했을까?', '이 효과는 어떻게 내는 거지?' 등등 궁금증이 생기고 있다. 1-2주차 수업이 HTML 기본 태그와 CSS 기초에 대해서 배웠다면 3주차 수업은 그 동안 배운것 복습과 보완이었다. 암튼 그래서 이번주는 설렁설렁 복습하다가 이제서야 블로그에 정리를 한다ㅎㅎ 몇일 안했다고 뇌가 멈추어버림.. 왼편 상단에 회사 로고가 있고, 오른쪽에는 About us / Contact us / History 등등 메뉴바가 있는 것을 만들어 보려고 한다. 오른쪽에 있는 고객센터, 미디어 센터 ..