웹사이트 css grid를 활용한 레이아웃

웹사이트 레이아웃을 위한 css는 몇 번을 거쳐 어느 정도 정착하게 되었습니다.2000년도 초기(또는 그 이전)에는 포토샵 slice 기능을 이용한 table layout, 그 후 몇 년간 float, position을 이용한 레이아웃이 주를 이루었던 기억이 있습니다. 마이크로소프트 익스플로러(ie) 때문에 삽질한 추억이 많네요..;;그리고 몇 년 전부터 flex, grid라는 스타일을 이용해 레이아웃을 많이 잡는데 그중 grid 공부할 때 기록해 둔 코드를 다시 살펴봤습니다. Logo main content1 content2 content3 content4 content5 content6 content7 content8 c..

미드저니 멀티프롬프트 이중 콜론 사용해보기::

미드저니 기능 중에 멀티 프롬프트라는 기능이 있습니다.멀티~ 즉 여러 개의 명령어를 사용해 다양하게 이미지를 생성할 수 있는 기능입니다. 단어와 단어 사이 또는 명령어와 명령어 사이에 이중 콜론을 추가하면 됩니다.사과:: 바나나 이런 형태로 가능하고 비중도 설정 가능합니다. 사과::4 바나나::1 이럴 경우 4:1의 비율로 이미지를 생성해 주는 기능입니다. 다만 아직은 조금 부족해 보이긴 합니다. 그리고 6 버전은 적용이 안되니 하위 버전에서만 사용 가능합니다.멀티 기능 없이 미드저니 홈페이지에 있는 예시를 참고해서 space ship을 입력한 결과입니다. space:: ship으로 해보니 원하는 이미지가 나오지 않아 outer space:: ship on the sea --v 5.0 로 나온 결과물입니..

반응형 홈페이지 줄바꿈(br태그) 대응하기 css

반응형 홈페이지를 만들다 보면 PC, 태블릿, 모바일 화면에 따라 br 태그에 의한 줄 바꿈이 다르게 보이는 경우가 있습니다.가나다라 마바사아자차카 타파하예를 들면 PC는 이렇게 나오는데모바일에선 아래처럼 나오는 경우입니다.가나다라 마마사아자차카 타파하 이럴 경우 br 태그에 css 스타일에 class 부여해서 조정가능합니다..pc_br {display:block}.t900_br{display:none}.mobile_br{display:none}@media all and (max-width:899px){ .pc_br{display:none !important} .t900_br {display:block !important}}@media screen and (max-width: 480px) { .t9..

미드저니 ai 이미지 생성 기능 중 Vary Region 기능을 사용해 봤습니다.특정 구역을 변경해 주는 기능이고, 먼저 생성한 이미지 중에 특정 부분을 수정하고자 할 때 사용합니다.오늘은 축구 관련 이미지를 만들어봤습니다. 2번이 마음에 드는데 필드에 축구공이 두 개네요.수정하기 위해 U2 버튼을 클릭합니다. 다른 버튼들과 함께 제일 오른쪽에 Vary (Region) 버튼이 보입니다.해당 버튼을 클릭하면 아래와 같이 레이어창이 뜹니다. Drag to select the area to be changed왼쪽 아래에 있는 선택 툴로 수정하고 싶은 부분을 선택하면 됩니다.공격수 왼발 뒤쪽에 있는 축구공을 선택한 다음 바꾸고 싶은 이미지를 프롬프트에 입력하면 됩니다.저는 soccer field floor로 입..

이번에는 무협소설 삽화에 들어가는 이미지를 만들어 봤습니다.프롬프트에는 "Chinese martial arts novel protagonist holding a long sword in one hand"라고 입력했습니다.상당히 좋은 이미지를 보여주네요~!! 과일은 왜..;; 3번 확대 이미지입니다. 오른손 모양이 조금 이상하지만 괜찮네요. 무협지에 남자 주인공만 있을 순 없으니 여자 이미지도 생성해 봤습니다. 무협지에 주로 나오는 빙제(?)를 요청했는데 제대로 나온 건지 모르겠네요.  프롬프트에는 위에 적은 명령어 조금 수정만 해봤습니다. 뭔가 얼굴만 돌출되어 보이는 듯..;; 이건 한국식 웹툰 형태로 그려달라고 요청해 본 이미지입니다. 3번을 업스케일 해봤는데 상당히 좋은 결과물이 나왔지만, 웹툰 이미..

앞서 포스팅한 사과, 배에 이어 다른 과일들도 한번 테스트해 봤습니다. 배처럼 다른 나라와 모양이 다른 경우 원하는 이미지를 만들기 어려웠기에 딸기, 귤, 참외 이렇게 세 가지로 해봤습니다. 1. 딸기프롬프트에 입력한 명령어는 아래와 같습니다.Whole strawberries and 2-3 halved strawberries placed on a bright and pretty plate. --ar 16:9 한 번에 좋은 퀄리티로 잘 만들어 주네요. 이것저것 생성한 이미지 중 하나만 올려봅니다. 잘린 단면이 저 모양이 맞는지는 모르겠네요.실물 사진 느낌은 아니지만 그래도 괜찮아 보입니다. 2. 귤대나무 채반에 담긴 귤을 만들어 달라고 요청했습니다.귤 역시 제법 그럴듯하게 만들어주네요. 사과랑 배, 그리고..