반응형 programming/TroubleShootInG44 html5 css3 홈페이지 메인 콘텐츠 목록 만들기 홈페이지 메인화면에 콘텐츠 목록을 넣는 것은 홈페이지의 주요한 정보를 한 화면에 보여주면서 사용자에게 흥미를 유발하고 오랜동안 머물도록 하는데 목적이 있다. 메인 화면에 들어가는 정보 중 일반적으로 인기글 최신글 등이 있으며 홈페이지 소유자마다 특색있는 것들을 목록으로 제공하는 경우들도 있다. html5 css3 홈페이지 메인 콘텐츠 목록 만들기 홈페이지마다 존재하는 메인화면은 랜딩페이지로써 홈페이지의 특성이나 주제를 표현하기도 하고 방문자에게 주요 정보를 제공하기 위한 목록을 제공한다. 메인화면에서 제공하는 목록은 어떤 것이 있을까 생각해 보자. 커뮤니티 사이트나 검색사이트를 들어가면 인기있는 게시물을 보여주고, 최신 게시물을 보여주며 급상승한 게시물 등을 보여준다. 제공하는 정보는 많지만 이것을 다시.. 2022. 11. 23. html5 css3 홈페이지 메인 콘텐츠 영역 만들기 콘텐츠는 왕이다 contents is king 홈페이지의 메인 콘텐츠는 중요한 내용과 홈페이지의 소개 등을 보여주는 영역이다. 홈페이지를 방문한 사람은 메인 화면을 통해 특성을 알 수 있고 어떤 내용이 있는지 예상해 볼 수 있다. 필요한 정보와 연관된 정보를 메인에 한꺼번에 보여준다면 방문자를 잡아 둘 수 있다. 개별 콘텐츠의 양이 많거나 콘텐츠의 특성별로 목록으로 나열한다면 방문자는 한동안 머물면서 콘텐츠를 살펴볼 것이다. html5 css3 홈페이지 콘텐츠 메인 영역 만들기 콘텐츠는 왕이다 contents is king display flex 를 이용하면 여러가지 귀찮은 작업이 없어진다. 홈페이지 메인을 구성할 때도 이것을 이용하면 수월하게 레이아웃을 잡을 수 있다. 이제는 콘텐츠 영역을 작업해 볼 것이다. 콘텐츠는 왕이다란 말이 있다. 단순히 .. 2022. 11. 23. html5 css3 네비게이션 메뉴 수평 정렬 하기 display flex 사용 css3의 display flex 속성은 html5 태그 요소를 수평 또는 수직 정렬하도록 한다. display flex의 기본값은 좌측에서 우측으로 단일로 진행하는 수평정렬이다. flex-direction 과 justify-content 등의 속성에 옵션을 주어 정렬 방법과 표현 방식을 다르게 설정할 수 있다. html5 css3 네비게이션 메뉴 수평 정렬 하기 display flex 사용 css3의 display flex 속성은 일정하게 나열된 html5 요소들을 수평 또는 수직으로 정렬하는 역할을 한다. 과거에는 float 를 사용하여 정렬을 했지만 불편한 점이 많았었다. display flex 을 사용하면 수월하게 정렬을 할 수 있다. 기본값은 수평정렬이며 좌측에서 우측으로 진행한다. 네비게이션 .. 2022. 11. 22. html5 css3 네비게이션 메뉴 목록 태그 ul 초기화 하기 홈페이지를 만들 때 메뉴를 추가할 때 목록 태그인 ul 을 할 수 있다. ul 태그는 목록을 나타낼 때 사용되는 태그로 메뉴나 페이징과 같은 간단하고 연속적인 데이터를 표현할 때 사용한다. 목록 태그는 기본적으로 점이나 숫자가 붙는데 이것은 list-style-type 을 사용하여 초기화하고 목록 태그에 붙는 스타일을 나타나지 않도록 할 수 있다. html5 css3 네비게이션 메뉴 목록 태그 ul 초기화 하기 목록 태그 ul 은 화면에 표시되는 문자열 데이터를 목록처럼 만들어 준다. 형태는 책의 목차와 비슷한 성격을 보인다. 위에서 아래로 일정한 간격으로 표시되기 때문에 간단한 목록이나 메뉴와 같은 네이게이션 페이징 등과 같은 기능에 사용된다. 단지, ul 태그는 점이 하나씩 붙는데 기본값으로 표시되는.. 2022. 11. 22. 이전 1 ··· 3 4 5 6 7 8 9 ··· 11 다음 반응형
