Web Programming/HTML & CSS 썸네일형 리스트형 gradient & box-sizing gradient & box-sizing [gradient] 화면을 꾸밀때 그래디언트 효과를 주고자 할때 기존에는 포토샵과 같은 그래픽 도구를 이용하여 이미지에 그래디언트 효과를 입혀서 그 이미지를 화면에 출력하는 방식을 써왔습니다. 하지만 이제 CSS3의 gradient를 이용하여 이 효과를 바로 적용시킬 수 있습니다. 아래와 같이 HTML과 CSS 파일을 작성합니다. [그림1]과 [그림2]와 같이 작성하여 HTML파일을 실행하면 브라우저에 다음과 같은 화면이 출력됨을 알 수 있습니다. CSS 파일 내용을 설명하면, div:nth-child(1) {background: linear-gradient(to right, green, lightgreen);} : 첫번째 블록에 그래디언트를 좌에 우측으로 적용하며.. 더보기 HTML과 CSS란? HTML과 CSS란? HTML은 "Hyper Text Markup Language"의 약자로 웹페이지를 만드는데 사용되는 언어입니다. 현재는 HTML5 버전이 사용되고 있습니다. HTML5를 사용하기 위해서는 HTML문서에서 ''이라고 선언함으로써 사용할 수 있습니다. HTML문서 기본 구성 [그림1]은 VISUAL STUDIO CODE로 HTML 기본 구성을 작성한 모습입니다. 단축키 '!' & 'Tab'키를 누르면 [그림1]과 같이 자동으로 작성되며 부분을 로 고치고 Document부분에서 'Document'를 원하는 프로그램 제목으로 바꿔주면 기본적으로 HTML 작성을 위한 구성은 완성된 것입니다. 그러면 CSS는 무엇일까요? CSS는 'Cascading Style Sheets'의 약자로 HTML로.. 더보기 이전 1 2 다음