INTL
Freelancer
보통
외주
원격 가능
Recreate a Home Page Layout CSS as a style.css file
예산
$20~$250 GBP
예상 기간
3~7일
난이도
보통
기술 스택
CSS
HTML
Flexbox
CSS Grid
AI 분석 요약 기회점수 42/100
기존 웹사이트 홈페이지의 레이아웃을 순수 CSS로 픽셀 단위까지 정확하게 재현하는 프로젝트입니다. 색상이나 타이포그래피는 제외하고 헤더, 내비게이션, 히어로, 콘텐츠 블록, 사이드바, 푸터 등 각 섹션의 위치와 간격을 원본과 2픽셀 오차 내로 맞추는 것이 핵심이며 Flexbox나 Grid를 활용해 주요 브라우저에서 호환되어야 합니다. CSS 레이아웃에 능숙한 프론트엔드 개발자나 퍼블리셔에게 적합한 단기 작업입니다.
핵심 요구사항
- 기존 사이트 홈페이지 레이아웃을 순수 CSS로 재현 (색상/폰트 제외)
- 헤더, 내비, 히어로, 콘텐츠, 사이드바, 푸터 등 모든 섹션 위치·간격 일치
- 스크린샷 오버레이 시 약 2픽셀 오차 내 정렬 (픽셀 정확도)
- Chrome, Firefox, Safari, Edge 최신 버전 크로스 브라우저 호환
- 섹션별 주석이 명확하고 확장 가능한 깔끔한 코드
산출물
- 섹션 주석이 포함된 style.css 파일 (또는 모듈화된 폴더)
- HTML 스켈레톤에 바로 적용 가능한 레이아웃 전용 CSS
매력 포인트
- 명확한 수용 기준 (2픽셀 오차)
- 레이아웃 전용으로 범위가 한정됨
주의사항
- 입찰 232건·평균 $123로 경쟁 과열, 저단가 낙찰 가능성
- 원본 사이트 URL 미제공으로 실제 작업 범위 불명확
- 클라이언트 국가 미기재 및 평판 정보 부재
프로젝트 유형단기작업
적합 개발자2~4년차 프론트엔드 개발자/웹 퍼블리셔 (CSS 레이아웃 전문)
클라이언트 정보
지원자232명
평균 입찰가$123
프로젝트 원문 설명
I need the exact layout of an existing website’s home page reproduced in pure CSS. This project is layout-only—I’m not interested in colours or typography right now. When your styles are applied to a simple HTML scaffold, every section (header, navigation bar, hero, content blocks, sidebar if present, and footer) should sit in the same positions and follow the same spacing rules as the original site.
You’re free to structure the work however you prefer—single style.css or a small, well-named folder of modular files—so long as the code is clean, commented, and easy for me to extend later. Flexbox or CSS Grid is fine; use whatever achieves pixel-accurate alignment across current versions of Chrome, Firefox, Safari, and Edge.
Deliverable
• A CSS file (or folder) that reliably recreates the home-page layout when I drop it into my HTML skeleton, with clear section comments.
Acceptance test
If I can overlay screenshots of my page (running your CSS) on the live site and the elements line up within roughly two pixels, the job is done.
You’re free to structure the work however you prefer—single style.css or a small, well-named folder of modular files—so long as the code is clean, commented, and easy for me to extend later. Flexbox or CSS Grid is fine; use whatever achieves pixel-accurate alignment across current versions of Chrome, Firefox, Safari, and Edge.
Deliverable
• A CSS file (or folder) that reliably recreates the home-page layout when I drop it into my HTML skeleton, with clear section comments.
Acceptance test
If I can overlay screenshots of my page (running your CSS) on the live site and the elements line up within roughly two pixels, the job is done.
Freelancer에서 원본 확인
원본 보기