홈페이지 제작할땐!

비버팩토리

반응형

it 언어 노트/html&css 5

css 긴 문장 ... 으로 처리하기

안녕하세요 비버팩토리입니다.문장이 2줄 3줄씩 길게 나오면 ... 으로 처리 방법을 설명 해봅니다. 우선 아래 자료 참고하면됩니다.  글자 라인이 적을 경우 아래 css 참고하면 됩니다.대신에 width는 퍼센트로 하면 됩니다. px는 사이즈가 고정적으로 줄여서 나와서 반대로 퍼센트는 양쪽으로 골고루 보이기엔 퍼센트가 낫습니다. (상황에 맞게 처리하세요) .txt_line { width:70%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }  멀티 사이즈로 할땐 아래 css 참고하면 됩니다..txt_post { display: -webkit-box; display: -ms-flexbo..

css 이미지 퀄리티 처리 방법 (feat.이미지 크롭)

안녕하세요. 비버팩토리입니다.이번 주제는 이미지 비율을 주는 방법을 설명합니다. 간단하게 사용법으로 설명 남깁니다. html5로 한다면 img 마크업와 figure 마크업 으로 클래스를 주고 아래 css 입히면 됩니다.크기는 고정이 아니라 레이아웃을 보면서 키워주면 됩니다..imgBox { width: 300px; height: 100%; object-fit: cover; display: block;}.parent { width: 300px; aspect-ratio: 16/9;} 그리고 php 에 경우 gd 라이브러리가 있어서 그걸 활용하면됩니다.그누보드에 경우에는 두번째 사이트 참고하면 됩니다.$thumb = get_list_thumbnail($bo_table, $wr_..

자주 사용되는 css

CSS란 무엇인가?CSS(Cascading Style Sheets)는, HTML(이나 XML)로 작성된 웹 페이지의 모양과 스타일, 즉 디자인을 지정하는 데 사용하는 언어입니다.CSS를 사용하면 글꼴, 색상, 배경 이미지, 레이아웃 등을 조정하여 웹 페이지를 사용자의 취향에 맞게 디자인할 수 있습니다.화면상의 웹 페이지뿐만 아니라 다양한 매체, 예를 들어 프린트할 때 종이에 어떻게 디자인할지 지정할 수 있으며, 시각장애인을 위한 스크린 리더의 음성 스타일도 일부 디자인할 수 있습니다.  ui/ux 즉 사용자 경험 디자인은 사용자가 제품, 서비스 혹은 시스템을 사용하거나 체험하는 데 있어 지각하는 것이 가능한 조직적 상호교감적인 모델을 창조하고 개발하는 디자인의 한 분야이다.  일부 사람 마다 용어를 퍼블..

자주 사용하는 마크업

- a 마크업 : 하이퍼링크  https://codingeverybody.kr/html-a-%ed%83%9c%ea%b7%b8/ 태그 – 올바른 이해와 사용 방법 - 코딩에브리바디" data-og-description="a 태그에 href 속성으로 지정한 URL이 있으면 이 태그의 콘텐츠로 표시되는 하이퍼링크(줄여서 '링크')를 나타냅니다. 이 태그의 콘텐츠(예를 들어, 텍스트나 이미지 등)를 클릭하면 링크된 URL로 이" data-og-host="codingeverybody.kr" data-og-source-url="https://codingeverybody.kr/html-a-%ed%83%9c%ea%b7%b8/" data-og-url="https://codingeverybody.kr/html-a-%ed%..

html / css 기초

안녕하세요! 비버팩토리입니다. 이번 주제는 퍼블리싱기초 공부에 대해서 남겨봅니다. 우선적으로 자주 사용하는 html5 는 article, asise, section, header, footer, nav 위주로 마크업을 사용 하면 됩니다.각자 사용법은 다양한데 제가 생각 하는게 맞다면 이런식으로 사용합니다.section 과 article 마크업은 하나를 묶어주는 마크업이라 생각합니다.  HTML  요소는 HTML 문서의 독립적인 구획을 나타내며, 더 적합한 의미를 가진 요소가 없을 때 사용합니다. 보통 은 제목을 포함하지만, 항상 그런 것은 아닙니다. https://developer.mozilla.org/ko/docs/Web/HTML/Element/section section, article 으로 사용하고..

반응형