CSS3 생성기. 최고

CSS 코드 생성기는 웹 개발자의 시간을 많이 절약하고 불필요한 오류로부터 보호할 수 있는 매우 편리한 도구입니다. 또한 코드를 더 쉽게 읽을 수 있습니다. 이 기사에서는 유용하다고 생각되는 여러 CSS 코드 생성기를 선택했습니다.

CSS 클릭 차트

CSS 치트시트

스프라이트박스

픽셀 지도 생성기

CSS 정리

CSS 애니메이션

글쎄요, 애니메이션? CSS에서 전환을 적용하고 재생해 보세요.

UI 그라데이션

기다리다! 생기 있게 하다

CSS 애니메이션 사이에 사용자 정의 반복 일시정지를 만드는 것은 결코 쉬운 작업이 아닙니다. 하지만 이 애플리케이션을 사용하면 절차의 복잡성이 0으로 줄어듭니다.

CSS3 생성기

CSS 유형 세트

다양한 글꼴이 어떻게 보이는지 보고 싶으십니까? CSS 유형 집합으로 이동합니다. 텍스트를 입력하고 글꼴 옵션을 선택하기만 하면 됩니다.

CSS를 즐겨보세요

유연한 상자

Flexbox를 이해하는 데 어려움이 있다면 Flexy Box를 사용해 보세요. 이 앱에서는 다양한 버전의 Flexbox와 구문 해석을 비교할 수 있습니다.

CSS 코드 생성기는 웹 개발자의 시간을 많이 절약하고 불필요한 오류로부터 보호할 수 있는 매우 편리한 도구입니다. 또한 코드를 더 쉽게 읽을 수 있습니다. 이 기사에서는 유용하다고 생각되는 여러 CSS 코드 생성기를 선택했습니다.

CSS 클릭 차트

CSS 치트시트

스프라이트박스

픽셀 지도 생성기

CSS 정리

CSS 애니메이션

글쎄요, 애니메이션? CSS에서 전환을 적용하고 재생해 보세요.

UI 그라데이션

기다리다! 생기 있게 하다

CSS 애니메이션 사이에 사용자 정의 반복 일시정지를 만드는 것은 결코 쉬운 작업이 아닙니다. 하지만 이 애플리케이션을 사용하면 절차의 복잡성이 0으로 줄어듭니다.

CSS3 생성기

CSS 유형 세트

다양한 글꼴이 어떻게 보이는지 보고 싶으십니까? CSS 유형 집합으로 이동합니다. 텍스트를 입력하고 글꼴 옵션을 선택하기만 하면 됩니다.

CSS를 즐겨보세요

유연한 상자

Flexbox를 이해하는 데 어려움이 있다면 Flexy Box를 사용해 보세요. 이 앱에서는 다양한 버전의 Flexbox와 구문 해석을 비교할 수 있습니다.

ㅏ! 발전기를 사용하시나요? CSS3또는 HTML5? 그렇지 않다면 시도해 볼 가치가 있을 것입니다 :) 버튼, 블록의 모서리, 그림자, 그라디언트(누군가 사용하는 경우) 등에 대한 스타일을 수동으로 설명하는 HTML5를 포기할 수 있다고 상상해보세요. 새 프로젝트를 생성할 때마다 동일한 코드를 작성하는 이유는 상자에 매개변수를 "입력"하고 버튼을 눌러 미리 만들어진 소스 코드를 얻고 필요한 경우 수정할 수 있기 때문입니다!
이 기사에서는 그러한 생성기의 선택을 보여 드리겠습니다. 대부분 CSS3 생성기와 HTML5용 생성기가 있습니다. 서비스 홈페이지로 이동하기 - 서비스명을 클릭하세요!

CSS3 생성기:

CSS3.me

최고의 발전기 중 하나입니다. 저자는 에릭 호프만. 가장 일반적으로 사용되는 효과인 반올림, 그림자, 그라데이션 및 투명도를 변경하고 설정할 수 있습니다.

CSS3 메이커

거의 모든 것이 있고 조금 더 있습니다. @font 면, 애니메이션, 상자 그림자, 텍스트 그림자, 텍스트 회전, 변형, 그라디언트, 반올림 등을 사용자 정의할 수 있습니다.

CSS3 생성기

이전 생성기와 거의 동일한 기능을 갖습니다. 드롭다운 목록에서 관심 항목을 선택하고 기본 데이터를 입력해야 합니다.

Webestools 섀도우 생성기

그림자 생성기. 색상, 오프셋, 흐림, 내부 또는 외부 그림자 등 그림자만 조정할 수 있습니다.

버튼 생성기

CSS3 버튼 생성기

재미있는 발전기. 오른쪽에는 조작의 결과인 하나의 큰 버튼이 있고 왼쪽에는 설정이 있습니다. 그림자, 테두리, 색상 등을 조작할 수 있습니다. 드래그 앤 드롭 슬라이더는 웹 사이트 구축이 처음인 사람들에게 적합합니다. 당신의 행동에 대한 반응을 즉시 볼 수 있다는 것이 좋습니다. 이를 통해 어떤 설정이 무엇을 담당하는지 이해할 수 있습니다.

CSS3-트릭 버튼 메이커

이 버튼 생성기는 좀 더 간단합니다. 버튼을 만드는 전체 과정은 슬라이더 드래그를 기반으로 합니다. 여기서 베팅은 배경에 있습니다. 즉, 버튼 색상을 가지고 노는 것입니다.

CSS3 Button.net

이것은 아직 나쁜 버튼 생성기가 아닙니다. 버튼 배경, 테두리, 외부 그림자, 내부 그림자, 크기, 텍스트 색상 및 텍스트 그림자를 사용자 정의할 수 있습니다. 오른쪽 블록을 변경하면 코드가 즉시 변경됩니다.

테두리 이미지 및 반경 생성기

경계 반경

매우 평범한 기능: 모서리 둥글림만 구성할 수 있지만 각 모서리는 별도로 구성할 수 있습니다.

테두리 이미지

배우기가 조금 어렵지만, 이미지에 테두리를 만들어야 한다면 이 도구가 딱 맞습니다! 이미지를 선택하고 슬라이더를 사용하여 테두리 크기를 선택하고 각 테두리의 배경을 늘릴 수도 있습니다. 또한 이미지를 반복하는 방법이기도 합니다. 그리고 코드는 아래에서 생성됩니다.

CSS3 그래디언트 생성기

Colorzilla 그라디언트 편집기

여기 정말 멋진 그래디언트 생성기가 있습니다. 기성 색상 세트가 많이 있지만 직접 선택할 수도 있습니다. 그라데이션 유형이 수평, 수직 등으로 설정됩니다. IE도 지원됩니다.

HTML5 생성기

HTML5 ★ 보일러플레이트

이 생성기를 사용하면 다양한 브라우저에 완전히 최적화된 템플릿 템플릿을 얻을 수 있습니다. 이 발전기가 정말 마음에 들었고 지금 사용하겠습니다. 모든 "트릭"에 대해 알아보려면 특히 모든 것이 러시아어로 되어 있기 때문에 이 프로젝트를 방문하세요.

Shikiryu HTML5 생성기는 이전 생성기보다 조금 더 복잡합니다. 페이지의 제목과 설명을 입력하고 CSS 프레임워크, CSS 버튼 스타일, 라이브러리, 분석 등을 연결할 수 있습니다.

초기화는 새 프로젝트를 시작하는 데 도움이 되는 HTML5 템플릿 생성기입니다. 초기화는 깨끗하고 사용자 정의 가능한 템플릿을 생성합니다. 선택된 매개변수는 기본 프레임워크, 서버 옵션(.htaccess, nginx.conf, web.config), jquery 연결, Google Analytics, 선택 등입니다.

이것은 간단한 생성기입니다. 페이지에 표시할 요소를 선택하고 몇 가지 옵션도 지정하라는 메시지가 표시됩니다.

그게 전부입니다. 좋은 HTML5 또는 CSS3 생성기를 알고 있다면 댓글에 자유롭게 적어주세요 :)

최신 기사와 강의를 받아보려면 다음을 구독하세요.

이 간단한 온라인 사이트 페이지 생성기를 사용하면 일반 텍스트 편집기에서처럼 사이트에 대한 페이지를 만들 수 있습니다. 웹페이지 본문에 가장 필요한 HTML 태그를 모두 생성할 수 있습니다. 웹사이트 페이지 본문용 HTML 코드 생성기는 웹사이트 페이지 생성 속도를 크게 높여줍니다.

사이트 페이지 생성기 사용에 대한 몇 가지 참고 사항

이 사이트 페이지 생성기는 페이지의 HTML 코드를 생성하여 이 생성기로 작업할 때 사용 중인 브라우저에서 페이지가 편집기 창에서 보는 것과 정확히 동일하게 표시된다는 점에서 시각적입니다. 이 편집기 생성기는 마크업 코드, 즉 HTML만 생성합니다. JavaScript나 PHP와 같은 프로그래밍 언어로 스크립트를 작성하기 위한 것이 아닙니다.

이 편집기는 HTML 마크업 언어를 이제 막 배우기 시작한 초보 웹마스터를 위한 것입니다. 그러나 숙련된 웹 사이트 빌더가 작은 페이지나 페이지 템플릿을 빠르게 만드는 데도 유용할 것입니다. 초보 웹마스터는 페이지 디자인의 변경 사항과 이것이 페이지의 HTML 마크업 변경 사항에 어떻게 반영되는지 빠르게 비교할 수 있는 기능에 매료될 것입니다. 이 빠른 비교를 통해 HTML을 최대한 빠르고 효율적으로 배울 수 있습니다.

이 편집기는 매우 큰 텍스트 및 큰 금액"무거운" 사진. 이 편집기에서 매우 큰 텍스트 및/또는 큰 이미지가 포함된 웹 페이지를 생성하려면 먼저 완전한 웹 페이지 템플릿을 생성하고 결과 HTML 코드를 웹 페이지 파일에 복사한 다음 긴 텍스트와 사진 링크가 있습니다. 이 편집기는 전문 편집자가 아니며 주로 아마추어와 초보 웹마스터를 대상으로 한다는 점을 기억하세요. 주요 목적은 초보자가 웹사이트 구축을 배울 수 있도록 돕는 것입니다.

사용 지침

MS Word와 같은 텍스트 편집기를 사용해 본 적이 있다면 이 웹 페이지 생성기를 익히는 데 어려움이 없을 것입니다. 이 편집기는 처음부터 웹 페이지의 본문을 생성하거나 기존 웹 페이지를 편집하여 자신만의 변경 사항을 적용하는 데 사용할 수 있습니다.

처음부터 페이지 만들기를 시작하려면 편집기 창에서 초기 텍스트를 지우고 거기에서 텍스트, 그림을 입력하고 고유한 서식을 지정해야 합니다. 작업이 완료되면 편집기 화면 하단에 있는 "코드" 버튼을 클릭하고 결과 코드를 웹페이지 파일에 복사해야 합니다. 그리고 이 파일을 저장하세요. 수신된 코드는 웹페이지 본문, 즉 태그 사이에만 복사하면 됩니다. 그리고

. 태그 자체 몸편집자가 만든 것이 아닙니다.

예를 들어 자신이 만들지 않았거나 오래 전에 만든 웹 페이지 등 이미 만들어진 웹 페이지를 편집하려면 편집기 화면 하단에 있는 "코드" 버튼을 클릭해야 합니다. 편집기 창에서 모든 초기 코드를 제거하고 웹 페이지 파일의 코드를 복사하세요. 기존 웹페이지 본문, 즉 태그 사이에 있는 코드만 복사하면 됩니다. 그리고

. 태그 자체 몸편집기에 복사할 필요가 없습니다. 그런 다음 시각적 편집 모드로 다시 전환해야 합니다. 이렇게 하려면 편집기 창 하단에 있는 "디자인" 버튼을 클릭하고 페이지 모양 변경을 시작하세요.

이 편집기에서 웹페이지 본문을 두 가지 방법으로 편집할 수 있다는 것은 분명합니다. "디자인" 모드에서는 시각적으로 편집하거나 "코드" 모드에서는 코드에서 직접 편집합니다. 따라서 초보 웹마스터에게 이 편집기는 학습에 매우 유용합니다. 시각적 모드에서 웹 페이지를 약간 변경하고 코드 편집 모드로 전환하면 코드가 어떻게 변경되었는지 즉시 확인할 수 있습니다. 또는 반대로 코드 편집 모드에서 웹 페이지 코드를 약간 변경하고 시각적 편집 모드(또는 "미리 보기" 버튼을 사용하여 보기 모드)로 전환하여 웹 페이지가 어떻게 변경되는지 즉시 확인할 수 있습니다.

기본 텍스트 편집

상단 메뉴 표시줄에는 일반 텍스트 편집을 위한 버튼이 포함되어 있습니다. 다른 텍스트 편집기에서 허용되는 표준 표기법이 있습니다. 그러므로 이에 대해 간단히 살펴보겠습니다.

모든 것이 매우 간단하게 작동합니다. 텍스트의 일부를 선택하고 상단 메뉴 버튼을 클릭하면 텍스트의 이 부분이 그에 따라 형식화됩니다. 또는 아무것도 선택하지 않으면 해당 버튼의 모드로 전환됩니다. 즉, 계속해서 텍스트를 입력하면 방금 켠 버튼의 모드로 텍스트가 입력됩니다.

또한 여느 텍스트 편집기와 마찬가지로 문단 전체에만 적용되는 모드와 문단의 일부에만 적용할 수 있는 모드가 있습니다.

메뉴 상단에 있는 모든 버튼에 대한 간략한 설명을 위치 순서대로 설명합니다.

  • 절. 타이틀 레벨을 선택합니다. 단락 전체에 적용됩니다.
  • 글꼴.
  • 글꼴 크기.
  • 글꼴 색상.
  • 볼드체.
  • 기울임꼴 글꼴입니다.
  • 밑줄 친 글꼴.
  • 취소선 글꼴입니다.
  • 왼쪽으로 맞춥니다. 단락 전체에 적용됩니다.
  • 센터링. 단락 전체에 적용됩니다.
  • 오른쪽으로 맞춥니다. 단락 전체에 적용됩니다.
  • 양방향 정렬. 단락 전체에 적용됩니다.
  • 수평선. 이것은 단락도 아니고 단락의 일부도 아닙니다. 이는 단순히 전체 너비에 걸쳐 수평선을 삽입하는 것입니다.
  • 어깨 기호.
  • 아래첨자.

기본 HTML 편집

중간 메뉴 표시줄에는 웹 페이지의 일반적인 편집을 위한 버튼과 일반 편집자를 위한 서비스 버튼이 모두 포함되어 있습니다.

메뉴 상단에 있는 모든 버튼을 위치 순서대로 설명합니다.

  • 하이퍼링크를 생성합니다. 마우스를 사용하여 클릭하면 다른 웹페이지로 이동하는 텍스트나 이미지를 선택해야 합니다. 선택 후 메뉴 버튼을 클릭하면 전환이 진행될 주소(URL)와 전환 조건(대상)을 지정해야 하는 창이 열립니다. 다음 조건을 설정할 수 있습니다.
    • 비어 있는. 기본적으로 새 페이지는 동일한 창에서 열립니다.
    • _공백. 새 페이지는 새 브라우저 창(또는 특정 브라우저 설정에 따라 새 브라우저 탭)에 나타납니다.
    • _부모의. 새 페이지가 상위 브라우저 창(또는 탭)에 표시됩니다. 상위 창(또는 탭)이 없으면 이는 _self 조건과 유사합니다.
    • _본인. 새 페이지는 링크가 있는 창에 표시됩니다. 이는 "비어 있음" 모드와 유사합니다.
    • _맨 위. 사이트 페이지가 프레임으로 구성된 경우(즉, 여러 창으로 분할된 경우) 새 페이지가 전체 브라우저 창에 표시됩니다. 일반적인 경우 이는 _self 모드와 유사합니다.
    하이퍼링크가 연결되는 새 페이지의 주소를 전체 형식으로 지정해야 합니다. "http://site.ru"또는 "http://site.ru/page.html". 그렇지 않으면 이 하이퍼링크를 다시 편집하려고 할 때 이 편집기는 사이트 주소를 찾지 못하고 기본적으로 내 사이트 주소로 대체됩니다. "http://사이트"페이지 이름 바로 앞에.
  • 하이퍼링크를 취소합니다. 하이퍼링크의 전체 텍스트를 선택합니다. 하이퍼링크 텍스트의 일부만 선택하면 선택하지 않은 부분은 하이퍼링크로 유지됩니다. 예를 들어, 하이퍼링크 텍스트의 중앙 부분만 선택하면 선택되지 않은 텍스트에는 동일한 주소를 가진 두 개의 하이퍼링크가 형성됩니다.
  • 그림을 삽입합니다. 그림이 있어야 할 곳에 커서를 놓고 버튼을 누릅니다. 열리는 창에서 이미지 경로(이미지 URL), 이미지 설명(이미지 설명), 페이지의 이미지 정렬(정렬), 테두리 너비(테두리) 및 텍스트에서 이미지 들여쓰기(또는 페이지의 다른 요소를 가로 및 세로로(HSpace), VSpace). 다음과 같이 이미지 정렬을 설정할 수 있습니다.
    • 비어 있는. 기본값은 왼쪽 정렬입니다.
    • 베이스라인. 한 단락의 이미지와 함께 위치한 텍스트(및 기타 페이지 요소)는 브라우저 작성자가 결정한 대로 배치됩니다.
    • 맨 위. 이미지와 같은 단락에 있는 텍스트(및 기타 페이지 요소)는 이미지 상단에 정렬됩니다.
    • 가운데. 이미지와 같은 단락에 있는 텍스트(및 기타 페이지 요소)는 이미지 중앙에 정렬됩니다.
    • 도트. 이미지와 같은 단락에 있는 텍스트(및 기타 페이지 요소)는 이미지 아래쪽에 정렬됩니다.
    • TextTop. 이미지와 같은 단락에 있는 텍스트(및 기타 페이지 요소)는 이미지 위에 배치됩니다. (모든 브라우저에서 지원되는 것은 아닙니다.)
    • 절대 중간. (모든 브라우저에서 지원되는 것은 아닙니다.)
    • 절대 바닥. (모든 브라우저에서 지원되는 것은 아닙니다.)
    • 왼쪽. 그림은 그림과 같은 단락에 있는 텍스트(및 기타 페이지 요소) 왼쪽에 배치됩니다.
    • 오른쪽. 그림은 그림과 같은 단락에 있는 텍스트(및 기타 페이지 요소) 오른쪽에 배치됩니다.
    삽입된 이미지는 더 이상 비주얼 편집기에서 편집할 수 없습니다. 따라서 이미지를 추가로 편집하려면 코드 편집 모드로 전환하십시오. 사진을 삭제하려면 해당 사진을 마우스로 클릭한 후 키보드의 삭제(Del) 버튼을 누르세요.
  • 포맷을 취소합니다. 단락의 일부 서식 지정에 적용되는 상단 메뉴 표시줄 버튼을 사용하여 수행한 서식을 취소합니다. 서식을 취소해야 하는 경우, 즉 원하는 텍스트 부분을 선택하고 이 버튼을 클릭하는 경우 상단 메뉴 버튼과 정확히 동일하게 작동합니다. 이 버튼의 편리함은 한 번의 클릭으로 선택한 조각에 있던 모든 유형의 모든 서식을 즉시 제거한다는 것입니다.
  • 테이블 생성 및 편집 버튼은 커서 위치에 테이블을 생성하거나 선택한 테이블을 편집하는 데 사용됩니다. 테이블을 생성할 때 다음 매개변수를 지정해야 합니다.
    • 행 - 행 수입니다.
    • 열 - 열 수입니다.
    • 너비 - 테이블 너비. 화면 너비의 백분율 또는 픽셀 단위로 설정합니다.
    • 테두리 - 셀 테두리의 너비입니다. 0으로 두면 셀 테두리가 표시되지 않습니다.
    • CellSpacing - 테이블 셀 사이의 거리(픽셀)입니다.
    • CellPadding - 셀 테두리에서 셀 내부 텍스트까지의 거리(픽셀)입니다.
    • 정렬 - 페이지의 테이블 정렬:
      • 기본. 기본적으로 브라우저 개발자가 설정한 대로입니다.
      • 왼쪽. 테이블이 페이지 왼쪽 가장자리에 눌려 있습니다.
      • 센터. 표는 웹페이지 중앙에 위치합니다.
      • 오른쪽. 테이블이 페이지 오른쪽 가장자리에 눌려 있습니다.
    표를 삭제하려면 테두리를 마우스로 클릭하고 키보드의 삭제(Del) 버튼을 눌러 테두리를 선택해야 합니다. 표를 편집하려면 표의 아무 곳에나 커서를 놓고(또는 표의 일부 또는 전체를 선택) 메뉴 버튼을 다시 누릅니다. 이 경우 행 수와 열 수를 제외한 모든 매개변수를 편집할 수 있습니다. 가운데 메뉴 표시줄에 있는 다음 6개 버튼은 이미 생성된 테이블의 행과 열 수를 편집하도록 설계되었습니다. 커서가 테이블 위에 있을 때 이 6개의 버튼을 클릭할 수 있습니다.
  • 커서 왼쪽에 열 하나를 만듭니다. 여러 열을 선택한 경우 커서는 선택한 마지막 열에 있는 것으로 간주됩니다.
  • 커서 오른쪽에 열 하나를 만듭니다. 여러 열을 선택한 경우 커서는 선택한 마지막 열에 있는 것으로 간주됩니다.
  • 커서 위에 한 줄을 만듭니다. 여러 줄을 선택한 경우 커서는 선택한 마지막 줄에 있는 것으로 간주됩니다.
  • 커서 아래에 한 줄을 만듭니다. 여러 줄을 선택한 경우 커서는 선택한 마지막 줄에 있는 것으로 간주됩니다.
  • 커서에서 하나의 열을 제거합니다. 여러 열을 선택한 경우 커서는 선택한 마지막 열에 있는 것으로 간주됩니다.
  • 커서에서 한 줄을 삭제합니다. 여러 줄을 선택한 경우 커서는 선택한 마지막 줄에 있는 것으로 간주됩니다.
  • 번호가 매겨진 목록을 만듭니다. 또는 일부 단락을 선택하고 메뉴 버튼을 클릭하십시오. 이 경우 이러한 모든 단락은 번호가 매겨진 목록의 요소가 됩니다. 또는 원하는 위치에 커서를 놓고 이 메뉴 버튼을 클릭하면 입력하는 모든 단락이 자동으로 번호 매기기 목록의 요소가 됩니다.
  • 간단한 목록을 만듭니다. 일부 단락을 선택하고 메뉴 버튼을 클릭하십시오. 이 경우 이러한 모든 단락은 번호가 매겨지지 않은 간단한 목록의 요소가 됩니다.
  • 들여쓰기를 제거합니다. 들여쓰기를 제거하려는 단락에 커서가 있어야 합니다. 전체 단락을 선택하거나 일부만 선택할 수 있습니다.
  • 들여쓰기를 만듭니다. 커서는 왼쪽 들여쓰기를 만들려는 단락 위에 있어야 합니다. 전체 단락을 선택하거나 일부만 선택할 수 있습니다. 들여쓰기는 첫 번째 줄뿐만 아니라 전체 단락에 대해 만들어집니다.
  • 모든 변경 사항을 롤백합니다. "코드" 또는 "미리보기" 버튼을 클릭할 때까지 모든 변경 사항을 삭제하고 마지막으로 코드를 보거나 페이지를 보았던 상태로 돌아갈 수 있습니다.
  • 제거된 모든 변경 사항을 앞으로 복원합니다. 필요한 것보다 많은 변경 사항을 롤백한 경우 제거된 변경 사항을 복원할 수 있습니다. 마찬가지로, 변경 사항을 롤백한 후 "코드" 또는 "미리 보기" 모드로 전환한 경우 더 이상 변경 사항을 복원할 수 없습니다.
  • 선택 항목을 Windows 포켓에 복사하는 동시에 선택 항목을 삭제합니다. (Ctrl+X)
  • 선택 항목을 Windows "포켓"에 복사합니다. (Ctrl+C)
  • 커서가 있는 곳에 Windows "포켓"의 내용을 붙여넣습니다. (Ctrl+V)

추가 HTML 편집

세 번째 메뉴 라인에는 주로 양식을 생성하고 편집하기 위한 버튼과 몇 가지 일반적인 버튼이 포함되어 있습니다. 추가 기능어떤 편집자.

세 번째 메뉴 줄에 있는 버튼 목록(위치순):

  • 양식을 만듭니다. 열린 창에서 양식 이름, 이 양식의 데이터를 처리할 스크립트의 주소 및 데이터 전송 방법(게시 또는 가져오기)을 입력해야 합니다.
  • 체크박스를 만듭니다. 열린 창에 이 선택 양식의 이름과 선택 시 허용되는 값을 입력하고 이 양식에서 선택 확인란이 처음에 선택되어 있는지 여부를 나타냅니다.
  • 라디오 버튼을 만듭니다. 열린 창에서 이 선택 양식의 이름, 선택 시 허용되는 값을 입력하고 이 버튼이 처음에 선택되었는지 여부를 나타냅니다. 라디오 버튼으로 메뉴를 생성할 때 동일한 메뉴의 모든 라디오 버튼은 동일한 이름을 가져야 한다는 점을 잊지 마십시오.
  • 텍스트 입력을 위한 플랫폼을 만듭니다. 열린 창에서 텍스트를 입력할 영역의 이름, 문자 수의 영역 너비, 영역의 줄 수, 단락 및 스크롤 막대의 위치, 이 필드의 초기 텍스트를 입력합니다.
  • "실행" 버튼을 만듭니다. 열리는 창에서 버튼 이름과 이 버튼에 쓰여질 텍스트를 작성합니다.
  • 이미지 형태로 '실행' 버튼을 생성합니다. 열리는 창에 버튼 이름과 버튼 역할을 할 사진의 주소를 적어주세요.
  • 완료된 양식을 지우고 모든 기본값을 반환하는 버튼을 만듭니다. 열리는 창에서 버튼 이름과 이 버튼에 쓰여질 텍스트를 작성합니다.
  • 숨겨진 필드를 만듭니다. 열리는 창에 숨겨진 필드의 이름과 해당 값을 적습니다.
  • 별표가 있는 비밀번호 필드를 만듭니다. 열리는 창에 비밀번호 필드 이름, 필드 길이, 사용자가 비밀번호를 입력할 때 입력할 수 있는 최대 비밀번호 문자 수를 입력하세요.
  • 텍스트 필드를 만듭니다. 열리는 창에서 텍스트 필드의 이름, 문자 크기, 사용자가 입력할 수 있는 최대 문자 수, 이 필드의 초기 텍스트를 작성합니다.
  • 인쇄를 위해 보냅니다.
  • 모두 선택하세요.

안녕하세요! 게시물의 디자인에 대해 즉시 설명하겠습니다. 어느 날 우연히 발견한 생성기의 엄청난 양의 정보와 탐색 요소가 별로 마음에 들지 않았고, 사용자 인터페이스도 훨씬 더 마음에 들었습니다! 나는 작업에 사용되는 도구에 대해 분노했습니다. 스타일- 그들 자신은 그들이 대표하는 가능성의 한계 내에 있지 않습니다... 어떻게 그럴까요?!

당신이 창의력을 발휘할 때, 당신은 마스터하고 작업할 수 있는 수단과 도구를 갖고 싶어합니다. 최저한의노력과 시간. 이 모든 결과로 다음과 같은 생각이 들었습니다. 최고를 선택하다도구와 정리하다자주 사용하도록 설정합니다(빠른 실행과 같은 탐색 메뉴).

이 노하우가 많은 분들에게 웹 개발 과정에서 좋은 조력자가 되기를 바랍니다.

CSS 생성기:

  • CSS3.me- 아름다운 도메인을 갖춘 간단하고 우아하며 동시에 기능이 풍부한 CSS 생성기
  • CSS3Maker.com- 새로운 CSS3 기능, 브라우저 간 호환성, 유연성 및 필요한 모든 기능을 갖춘 매우 광범위한 기능;
  • CSS3Generator.com-고전과 단순함을 좋아하는 사람들을 위해 불필요한 것은 없습니다. 한마디로 "오래된 학교"입니다.
  • Colorzilla.com- 대부분의 브라우저를 지원하고 이미지를 사용하지 않고(순수 CSS) 아름다운 배경 이미지를 생성하기 위한 그라데이션 생성기입니다.

웹 도구:

  • 버튼 빌더- Web 2.0의 리듬에 맞춰 버튼을 디자인하는 도구입니다. 기능 중에는 내부 패딩, 텍스트 크기, 모서리 둥글기 및 그라데이션 색상 선택 등을 사용자 정의하는 기능이 있습니다.
  • 양식 작성기- 양식 전체와 개별 요소의 모양을 사용자 정의할 수 있는 양식 디자이너입니다.
  • 아이콘 빌더- 버튼, 메뉴, 파비콘에 대한 새로운 아이콘을 만들어 무료 아티스트가 된 기분을 느껴보세요.
  • 리본 빌더- 순수 CSS를 사용하여 세련된 리본을 만들려면 이 도구를 다양한 설정 및 옵션과 함께 사용하세요.
기사 시작 부분에 있는 버튼(아이콘) 형태의 그림 - 클릭 가능!

제안 사항이 있거나 이 아이디어를 뒷받침할 수 있는 흥미로운 도구를 알고 있다면 알려주세요. 쓰레기를 버리지 마세요. 우리는 어셈블리에 독점 아이템만 추가하고 싶습니다. 감사합니다.