CSS 4

LikeLion at UOS #5_ 페이지 제작 실습(2)

안녕하세요. 문범우입니다.해당 포스팅은 서울시립대학교 멋쟁이사자처럼, 4월 1일 수업에 대한 내용입니다. 금일 수업에서는 그동안 진행했던 내용을 바탕으로 하나의 웹페이지를 그대로 따라 구현해보는 실습을 진행하였습니다.따라서 해당 포스팅에 대한 순서는 아래와 같습니다. - 지난 시간 복습- 구현해 볼 웹 페이지 소개(HTML/CSS)- Jquery 구현 1. 복습 지난 시간에는 주로 Jquery에 대해서 알아 보았습니다.그 동안 html과 css로 구현한 웹 페이지는 정적인 형태였습니다.이에 추가적으로 배워본 Jquery는 동적인 형태의 페이지를 구현하는데 사용됩니다.예를 들어 메뉴 버튼에서 마우스를 가져간 항목의 글자가 더 찐해지거나 색상이 바뀌는 것, 무언가를 클릭했을 때 요소의 등장이나 사라짐등의 효..

LikeLion 2018.04.02

LikeLion at UOS #2_ HTML 태그들과 CSS 기초

안녕하세요. 문범우입니다.이번 포스팅에서는 HTML에서 사용되는 몇가지 태그들에 대해서 간단히 알아보고 CSS에 대한 기초적인 내용을 알아보도록 하겠습니다.전체적인 순서는 아래와 같습니다. - HTML 태그 - Emmet 이란? - CSS 적용 방법 3가지 1. HTML 태그 일단 지난 포스팅에서 아래와 같은 코드까지 작성을 하였습니다. 이때, h1태그로 내용을 묶어줌으로써 글씨의 크기나 모양이 바뀌었습니다.HTML에서는 이와 같이 기본적으로 어떤 특징을 가지고 있는 여러가지 태그들이 있습니다.물론 각 태그들에 대해서 style속성을 변경하거나, CSS를 적용하는 등의 방법으로 모양을 더 바꿀 수 있지만, 각각의 태그들이 통상적으로 사용되는 경우가 존재하고 각각의 태그들의 특징도 있기 때문에 몇가지 태그..

LikeLion 2018.03.22

Ruby #2_ 영화검색 사이트 만들기(2)

지난 포스팅에 이어서 계속 진행합니다!영화를 검색하기 위해 영화제목 입력창과 버튼을 추가합니다.bootstrap에서 CSS->우측 Forms에 들어가서 처음보이는 code를 복사해 필요한 부분만 남겨두고 지워버리겠습니다.위의 그림에 보이는 code를 복사하여 index.html.erb 파일의 상단에 붙여놓고 필요한 부분만 남기고 지우겠습니다. 지금까지 작성한 code로 run하면 아래와 같이 화면이 구성됩니다. 이제 model 개념을 사용합니다. bash 창에 아래와 같은 명령어를 입력합니다. rails g model list그리고 rake db:migrate ( ':' 양쪽에 공백이 있으면 안돼요!) 두 명령어를 입력하면 아래 사진과 같이 db/migrate 에 새로운 파일이 생깁니다. 해당 파일의 코..

Web 관련/Ruby 2017.10.16

Ruby #1_ 영화검색 사이트 만들기(1)

cloud9 을 이용해서 ruby언어를 통해 영화검색 사이트를 만들거에요.처음이신분들도 쉽게 따라올 수 있도록 진행하겠습니다. 먼저 c9을 이용해서 workspace를 만들어줍니다. 언어는 Ruby를 사용합니다! 개발환경을 구축하기 위해 bash창에 아래와 같은 명령어를 입력하여 movie라는 controller를 생성합니다. rails generate controller movie index 그럼 좌측에서 app폴더안에 controllers폴더 안에 views 폴더에서 movie라는 폴더가 생긴것을 확인하실수 있습니다. 그리고 index.html.erb파일을 먼저 작성해보도록 할게요! 그리고 위의 index.html.erb 파일에서 먼저 구조를 잡도록 할게요. 위와 같이 초기 구조를 잡았습니다. 그리고..

Web 관련/Ruby 2017.10.15
728x90