웹퍼블리싱 (4) 썸네일형 리스트형 CSS 소개와 사용방법 (CSS란 무엇인가?) CSS 소개 첫 단추 페이지를 포스팅하기 전에 잠시 CSS가 태어나게 된 일화를 간단히 소개 후 넘어가도록 할게요 먼저 CSS는 Cascading Style Sheets의 약어로 사전적 용어로 풀이해 나타내면 계단식 스타일 시트라고 불립니다. 홈페이지 제작을 했었던 1,2세대 초기 웹디자인과 개발자들은 CSS라는 표준형 언어가 생기기 전에는 웹페이지 폰트에 컬러를 주거나 단일 페이지나 공용 페이지에 특수한 효과를 주고 싶을 때, 모든 페이지에 일일이 스타일 용어를 적용시키거나 개발자를 통한 프로그래밍적 언어로 제어를 해야 했습니다. 이때 당시에는 웹디자이너가 추구하는 미적 효과와 그것들을 실행해야 하는 개발자 사이에 마찰이 불가피했었는데요, 페이지가 늘어나면 늘어날수록 일일이 대입해 적용해야 했기 때.. 절대경로와 상대경로 개발언어와 퍼블리싱 소스코드를 제작하는 경우에는 경로 지정이 필수적으로 필요한데, 이와 같은 작업은 절대경로와 상대경로를 지정할 수 있습니다. 절대경로 웹사이트의 주소와 경로이름으로 설정한 방법을 이야기합니다. 예를 들어 웹사이트 주소와 경로가 정해져있는 abc폴더를 지정하기 위해선 http://blueseal.kr/main/sub/abc.html 와 같이 해당하는 도메인 주소를 기입한 후 해당폴더를 하단카테고리로 지정하는 /로 구분지어 줍니다. 각 폴더의 지정된 이름을 나열한다고 하여 절대경로라고 부르고 있습니다. (도메인을 제외한 폴더 이름을 지정하는 루트상대경로와도 일맥상통하는 부분입니다.) 장점은 폴더 구성을 눈으로 쉽게 볼 수 있는 반면, 단점은 서버를 옮기거나 폴더 구성이 바뀔 경우 다.. 홈페이지 이미지 요소와 속성 속성이라고 말하는 부분은 모든 태그 요소에 들어가는 html이 이해하도록 명령해주는 코드라고 생각하면 이해가 쉽습니다. img ▲이미지는 이렇게 시작되며, src=""라는 속성을 붙여줌으로서 정상적으로 동작합니다. 확장자명은 .jpg처럼 꼭 붙여주어야 인식합니다. ▲또한 이미지의 크기도 지정할 수 있는데, 가로(width) 세로(height)를 지정해 원하고자 하는 크기를 정해줄 수 있습니다. (가로와 세로를 지칭하는 width, height는 나중에 CSS에서도 많이 쓰는 퍼블리싱 요소기 때문에 단어 입력을 손에 꼭 익혀 놓으시는 게 좋습니다.) ▲ alt 요소로 이미지가 가진 내용의 의미를 붙여 줄 수 있으며, 이는 엑박이 뜨는 현상을 대체하거나 시각장애인들을 위한 태그 요소로 꼭 붙여주시는 게 좋습.. 홈페이지 css연결하기 (LINK script,css연결) 홈페이지의 정보와 성격인 독타입(Doctype)과 메타태그(Meta tag)를 시작한 후 (html 게시글1번 참고) 다양한 기능들을 활용할 수 있는 필수소스인 script와 css를 플러그인화 시키는 타입으로 연결 함으로서 최종적으로 홈페이지의 제작 준비가 끝났음을 선언할 수 있습니다. 우주에서 우주선 또는 인공위성들이 결합하는 것을 도킹이라고 부르는데, 광할한 웹에서 홈페이지 제작을 위해 명령어를 담은 페이지들이 마치 결합하는듯 장착되어 홈페이지를 제작하게 되는 모습을 띄는바 html docking이라 블로그에선 새롭게 명명합니다. 연결은 사이에 입력하는 것으로 시작되며, 각종 "홈페이지를 사용할 수 있는 명령어를 담은 장치들이 머리에 장착된다"고 이해하면 간단하고 쉽습니다. 그 중 그 언어는.. 이전 1 다음
