# 레이아웃

yoon1120

구글 웹 폰트 https://fonts.google.com @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300&display=swap'); *{ font-family

x5foddl

float: left 요소를 붕 띄워서 왼쪽 정렬clear: bothfloat 다음에 오는 요소에게 주면 float로 발생하는 이상한 현상 해결 가능.header { width: 100%; / 부모 태그 width의 100% / height: 50px;

expo_daniel

ex) <img>, <a>, <span>, <strong> 등옆으로 쭉 나열 되다가, 공간이 모자라면 다음 줄로 넘어간다.ex) <div>, <p> 출처: https://studiomeal.com/archives/282

pretzel-1910

Block과 Inline 요소의 성격을 바꿀 때 사용inline-block을 사용하면 두 요소의 성격을 가짐왼쪽 정렬, 오른쪽 정렬선택자를 띄워 새로운 레이어 층을 만듬레이어가 겹치지않게 정렬하고싶으면 연속으로 입력float 속성을 제어할때float을 사용한 태그 다음

aldus107

float는 편집 디자인에서 이미지를 삽화로 삽입할 때 사용하는 기법이다. 또한 레이아웃을 잡을 떄도 사용하는 기능이기 때문에 효과적이다.background-size \-> cover : 이미지를 공간안에 꽉 채운다. \-> contain : 이미지의 삭제없이 다

hitsuji_velog

css를 이용해서 단순한 문서 형태인 HTML을 보기 좋게 배치하고 재배열 하는 것관련 기능, 완성된 배열 등을 포괄적으로 지칭한다.(레이-아웃 : 출판/광고/건축 분야 등에서 문자/그림/사진 등을 지면 위에 시각적 효과와 사용 목적을 고려하여 구성/배열하는 일)전체

magnacut

Flex가 무엇인지 어떻게 사용하는지 알아보자

crg1050

와이어프레임, 레이아웃 구조, flex box등에 대해 배웠다.오늘 부터 페어 활동으로 다른 수강생분과 2인 1조가 되어 같이 공부하고 해결해 간다. 처음이고 긴장했지만 수강생분들도 다들 처음일 거다. 용기내서 다가기로 하자.웹 또는 애플리케이션을 개발할 때 레이아웃의

suhee524

※블로그 내용은 저 '개인'의 기준으로 더 필요하다고 생각되는, 또는 한번 더 짚어보는 의미로 필기한 것입니다. 수희 혼자 볼라고 쓴 블로그※단축키1\. Ctrl + Alt 키를 누른 상태에서 위, 아래 방향 화살표로 세로 선택 영역을 조절합니다.2\. 세로로 여러 줄

keembloo

웹 브라우저의 레이아웃을 나눌 때 여러 방법 중 하나인Flex에 대해서 정리하려고 한다.html에서 class 속성을 부여한다.css에서 box에 flex 속성을 부여한다.그리고 이어서 css에 필요한 이펙트들 태그를 넣어본다.크롬에서 F12를 눌러보면 브라우저 속성을

lekosk2001

앱의 라우팅 구조와 레이아웃 구조를 설정하였다.

tygerhwang

이번 글에서는 Frame Layout에 대해서 알아보도록 하자.FrameLayout은 Flutter의 Stack 기능을 갖추고 있는 레이아웃이다.Flutter에서는 여러 위젯을 겹쳐서 UI를 보여주고 싶을 때 Stack을 사용하면 된다. Children 값의 Widge

yj05037

유튜브, 모달, 별점, 주소 수정사항: 주소, 링크 아이콘 / 좋아요 싫어요 아이콘 / 유튜브 상자크기조정/ 수정하기누르면 defaultValue다 넣고...... defaultValue와 value...... 수정하기때문에 기존에 defaultValue사용했었음.

tygerhwang

LinearLayount에 이어서 이번에는 ConstraintLayout에 대해 글을 작성해 보겠다.Flutter에도 Constraints 위젯이 있는데, 같은 기능이라고 보면된다. 저는 Constraints 관련 위젯은 잘 사용하지 않습니다. Native 앱 개발시에

deong_gu

테일윈드 CSS flex, daisyui CSS

youa7878

브라우저 렌더링에서 렌더링(rendering)이란 HTML, CSS, JavaScript 등 개발자가 작성한 문서가 브라우저에서 출력되는 과정을 의미합니다. 현존하는 브라우저마다 다르지만, 브라우저는 기본적으로 렌더링을 수행하는 렌더링 엔진을 가지고 있습니다.사용자가

gomuzom

Build a Responsive UI for multiple screen sizes App Preview

heyroocoke

웹 디자인 분야에서는 화면을 세로로 몇개의 영역으로 나눌 것인가에 초점을 맞춘 컬럼 그리드 시스템 (Column Grid System)을 사용하며, Margin, Column, Gutter라는 세 가지 요소로 구성된다.화면 양쪽의 여백을 의미너비를 px와 같은 절대 단

namyeji

주니어 개발자로 게시판 등록 조회 쉬웠는데 작은 프로젝트를 처음부터 구조를 잡으려 하다보니 뭐부터 해야하나 싶어 배너같은 부분을 어떻게 해야하나 웹페이지 하나 만들고 모바일 사이즈에서는 반응형으로 움직여야하고, 이럴때 메뉴를 어떻게 해야하나 레이아웃. 메뉴는 하나만 만

superrookie

실전이 시작되었다.