본문 바로가기

css380

가장 최근의 플리커 업로드 표시 이 코드는 모든 계정에 대해 Flickr에서 가장 최근에 업로드한 내용을 표시합니다. 아래 코드의 "35591378@N03"(화이트하우스 계정)을 가져오는 계정의 ID로 바꾸십시오. 찾는 데 도움이 필요하면 이것을 사용하세요. 루프에서 "9"를 10보다 많거나 적도록 변경합니다. $(document).ready(function() { $.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?id=35591378@N03&format=json&jsoncallback=?", function(data) { var target = "#latest-flickr-images ul"; // Where is it going? for (i = 0; i 2021. 10. 9.
의견조사 결과: 일은 언제 끝날까요? 이 여론조사가 처음 시작되었을 때, "늦은" 선택권이 훨씬 앞서 있었다. 시간이 흐르면서, 상황은 조금씩 안정되었고, 결과는 내가 생각했던 것보다 더 가까워졌다. 만약 여러분이 제시간에 오거나 일찍 온다면, 축하해요! 즉, 프로젝트 완료 시간을 매우 잘 추정한다는 의미입니다. 나머지 사람들에게, 그것은 우리가 지금보다 그 날짜들을 조금 뒤로 미루기 시작해야 한다는 것을 의미한다. 물론 마감일을 지키는 것은 작업 속도와 고객과의 의사소통 능력에 달려 있습니다. 하지만 우리는 완성일을 발표하는 사람들이기 때문에, 이러한 것들을 예상하는 것이 우리의 일입니다. 그리고 여러분은 그들이 말하는 것을 알고 있습니다, 약속을 어기고 너무 많이 배달합니다. 이번 주 후반에 새로운 여론조사 결과가 나왔습니다. 2021. 10. 9.
새로운 의견조사: CSS를 어떻게 포맷합니까? 투표는 사이드바에 있으니 투표하러 내려가세요. CSS를 포맷하는 다양한 방법의 예를 여기서 볼 수 있습니다. 나는 그것이 CSS를 포맷하는 대부분의 인기 있는 방법들을 포함한다고 생각하지만, 만약 여러분만의 독특한 방법이 있다면, 자유롭게 몇몇 코드나 예제 CSS 파일에 대한 링크를 댓글에 올리세요! 저는 이것이 사이트에 함축되어 있는 모든 의미와 프런트 엔드 코더의 작업 삶 때문에 흥미로운 주제라고 생각합니다. 우리는 CSS에서 너무 많은 시간을 소비하기 때문에 CSS 포맷을 선택하는 방법이 얼마나 효율적으로 작성할 수 있는지, 오래된 CSS를 얼마나 쉽게 재인식하는지, 그리고 사용자가 CSS를 압축하지 않는다고 가정할 때 페이지 로딩 시간까지도 영향을 미칩니다. 2021. 10. 9.
모든 사용자 지정 필드 덤프 WordPress에는 모든 사용자 정의 필드를 출력하기 위한 내장 함수인_meta()가 있습니다. 그러나 이 기능은 항상 모든 기능을 출력하는 것은 아니라는 점에서 제한됩니다. 예를 들어 _ 밑줄로 시작하는 플러그인에 의해 추가된 사용자 정의 필드가 누락됩니다. 이 코드 비트는 대체 함수 get_post_custom()을 사용하여 모든 함수를 반환하고 모든 값을 표시합니다. 디버깅에 적합합니다. All Post Meta 2021. 10. 9.
내게 필요한 옵션 기본 사항: 페이지의 색맹 테스트 일부 추정에 따르면, 세계 남성 인구의 최대 10%가 어떤 형태의 색맹으로 고통 받고 있다. 가장 흔한 것은 적녹색맹인 프로타노피아입니다. 적색과 녹색을 구분하지 못합니다. 블루 옐로우 색맹과 토탈 컬러 블라인드도 있습니다. 훌륭한 웹 디자이너들은 엄청나게 다양한 웹 브라우저와 심지어 스크린 리더를 사용하는 사용자들을 수용하기 위해 웹사이트를 손보고 수정하는 데 엄청나게 많은 시간을 보낸다. 이런 종류의 작업은 여기저기서 시청자의 소수를 수용하기 위해 수 많은 시험, 머리를 쥐어뜯는 해킹, 그리고 잠을 못 이루는 밤을 포함한다. 물론 접근성도 중요하기 때문에 그만한 가치가 있습니다. 몇 단계 더 나아가 시각 장애가 있는 사람들이 여러분의 완벽한 레이아웃을 실제로 읽을 수 있도록 하는 것은 어떨까요? 다음.. 2021. 9. 28.
블로그 상태: 통계 및 업데이트 블로그러시 안녕. 저는 블로그러시를 건강하게 시도하고 싶었습니다. 그래서 블로그러시는 두 달은 아니더라도 한 달 넘게 사이드바에 있었습니다. 그들은 방금 2단계를 발표했고, 그것이 바로 제가 기다리던 것입니다: 실제 통계. 저는 지난 7일 동안 수만 개의 크레딧을 모았고 제 각각의 게시물은 블로그러시 네트워크를 통해 수천 번 신디케이션되었습니다. 각 게시물마다 몇 명의 독자가 있는지 맞춰보세요. 제로. 모든 기둥이 얼음장처럼 차가워. 지난 30일 동안 5명의 독자가 있었고 그 중 3명은 다른 블로그에 있었습니다. 이 정도로는 위젯을 사이드바에 보관할 수 없습니다. 사이드바를 다시 디자인하여 곧 제거할 예정입니다. 안녕 스텀블어폰. StumbleUpon은 이 블로그의 훌륭한 트래픽 원천이다. 그동안 잘 지.. 2021. 9. 28.
두 워드프레스 블로그의 모든 게시물을 하나로 결합 이것이 이것에 대해 가장 좋은 방법인지 아닌지는 잘 모르겠지만, 최근에 이것을 해야 할 필요성이 생겼고 이것이 제가 한 방법이다. 이 튜토리얼은 완전히 새로운 블로그를 만드는 대신 한 블로그를 "닫고" 다른 블로그로 결합하는 시나리오에 초점을 맞추고 있습니다. **이 단계를 수행하기 전에 두 데이터베이스를 모두 백업하고 분리하여 안전하게 보관하십시오. 1단계: wp_posts 테이블을 로 내보냅니다.SQL 당신이 가장 먼저 해야 할 일은 을 얻는 것이다.닫을 블로그에서 wp_posts 테이블의 SQL 파일. 이 기능은 phpMyAdmin에 액세스할 수 있는 경우 매우 쉽습니다. Export 탭으로 이동하여 wp_posts 테이블을 선택하고 "Save as File"을 선택합니다. 이렇게 하면 SQL 파일.. 2021. 9. 28.
Mac CSS 에디터 리뷰 CSS 파일을 만들고 편집할 수 있는 아주 좋은 소프트웨어가 있습니다. 저는 주로 Mac 사용자이기 때문에 이 리뷰는 Mac에 초점을 맞추고 있습니다. 하지만 공유할 것이 있다면 Windows CSS 편집기에 대해 듣고 싶습니다. 결국, 그것은 그 일에 가장 적합한 도구이다. 자일 스코프 교양강령에서 19.95달러에 구입하실 수 있습니다. Xyle Scope는 완전히 시각적인 CSS 편집기의 접근 방식을 취합니다. 기본적으로 페이지에서 요소를 선택할 수 있는 웹 브라우저입니다. 창의 사이드바는 "드릴다운"하여 선택한 요소의 HTML과 CSS를 표시합니다. 즉시 편집할 수 있으며 효과를 확인할 수 있습니다. 이 기능은 매우 강력하며 고리형 레이아웃 문제를 해결하는 데 유용한 도구입니다. 사실, Xyle S.. 2021. 9. 28.
CSS3 아이디어: 페이지 요소의 회전 CSS3의 회전에 대한 논의가 있다. 다음은 몇 가지 중요한 사항입니다. 회전에는 레이아웃 중에 발생하는 회전(내용 아래로 밀어넣기)과 레이아웃 후에 발생하는 회전의 두 가지 유형이 있습니다. width: 회전된 요소의 auto는 회전 전에 사용 가능한 너비를 사용한다는 것을 의미합니다. width: max-fit; rotate-to-fit-fit-fit-to-fit-to-fit 텍스트는 텍스트 주위에서 축소 포장을 통해 너비를 찾고 해당 블록에 맞는 가장 작은 각도를 선택할 수 있습니다. width: shrinkwrap은 회전 후 사용 가능한 공간을 사용하며, 한 줄로 시작하여 최소 내용 너비(또는 최소 너비)에 도달할 때까지 더 많은 콘텐츠가 들어올수록 블록을 더 길고 좁게 만듭니다. 이미지 방향은 .. 2021. 9. 28.
GIF를 이용한 페이지 요소의 미묘한 애니메이션 저는 페이지들이 서로 다른 페이지 요소를 강화하기 위해 매우 미묘한 애니메이션을 사용하는 것을 정말 좋아합니다. E-Junkie 사이트와 도장에 있는 작은 불꽃남을 로고로 확인해 보세요. 이따금씩 눈을 깜빡거리는데 꽤 멋진 효과가 있어요. 그들은 이런 효과를 얻기 위해 GIF 애니메이션을 사용합니다. 그래서 저는 여러분에게 저만의 예를 보여드리고자 합니다. 스푼 그래픽스의 크리스 스푸너는 매우 멋진 프랑켄스푼 괴물을 디자인했다. 나는 올 프랑켄스푼을 약간 수정해서 그를 예시 사이트의 헤더에 사용했다. 또한 사이트 상단 테두리의 강조 표시는 때때로 앞뒤로 이동합니다. [라이브 예시] [다운로드 예제] 2021. 9. 28.
완벽한 유체 폭 레이아웃 저는 최근에 화면 해상도와 유동적인 폭의 웹사이트를 사용하는 것이 어떻게 모든 방문객들의 화면 해상도를 수용할 수 있는 가장 좋은 방법인지에 대해 많이 생각해 보았습니다. 정적인 폭의 대안 웹사이트는 선택을 해야 합니다. 가장 낮은 공통분모인 800px 너비에 최적화하고 더 큰 화면을 가진 사용자의 경우 수백 픽셀의 너비를 사용할 수 없습니다. 또는 1024px에 맞게 최적화하고 방문자 800px를 수평 스크롤만 할 수 있습니다. 내 생각에 1024px보다 큰 것은 정적 너비 사이트에는 무리이다. 가장 좋은 시나리오는 모두를 수용할 수 있는 유동적인 폭의 사이트를 만드는 것이라고 생각합니다. 다음은 "완벽한" 유체 폭 레이아웃입니다. 모든 주요 브라우저에서 작동 780px로 축소 수평 스크롤 없이 800.. 2021. 9. 28.
유체 폭 및 부유 물체 가능성 유체 폭 레이아웃을 만드는 일반적인 기술은 메인 콘텐츠가 최소 및 최대 너비를 갖도록 한 다음 다양한 기법으로 모든 브라우저에서 작동하는지 확인하는 것입니다. 또 다른 방법은 브라우저 창 자체에 상대적인 절대 위치를 페이지에 부여하는 것입니다. 예를 들어, 페이지 하단에 요소를 "붙일" 수 있습니다. div#stickbottom { position: absolute; bottom: 0; } 마찬가지로 페이지의 아무 영역에나 요소를 붙일 수 있습니다. 백분율로 요소를 배치하면 더욱 흥미롭습니다. 예를 들어 다음과 같은 방법으로 요소를 페이지의 오른쪽 가장자리에서 항상 10% 떨어지게 할 수 있습니다. div #farright { position: absolute; right: 10%; } 이 기술을 사용하.. 2021. 9. 28.
블루 플로이버 헤더 설계 기법 헤더는 웹 설계의 중요한 요소로 설계를 만들거나 해제할 수 있습니다. 웹 2.0 이후, 우리는 많은 디자인 트렌드를 보아왔고, 가장 획기적인 것 중 하나는 큰 머리말입니다. 그러나 헤더는 내내 상자 모양으로 남아 있었다. 모바일 디자인 웹사이트인 Blueflavor는 제가 아직 다른 곳에서 보지 못한 것으로 이러한 추세를 극복했고, 창조하는 데 훌륭한 CSS 기술이 필요하지 않습니다. 보시는 바와 같이 헤더에 내용 메뉴와 시작이 있습니다. 어떻게 그럴 수 있을까요? 이미지를 여러 조각으로 잘라 (플로팅) 디브로 맞출 수 있습니다. 그러나 이로 인해 IE 6, 7, Firefox와의 브라우저 차이에서 발생할 수 있는 문제가 발생합니다. The best way is to keep the image whole.. 2021. 9. 28.
다중 원격 링크: 예제 및 사용 방법 원격 링크란? 원격 링크는 페이지의 다른 개체에 영향을 주는 롤오버입니다. 롤오버는 자체에도 영향을 미칠 수 있습니다. 이것은 PURE CSS로 할 수 있고, 매우 시원하고 가벼운 기술로 만들 수 있습니다. 이 예에서는 색칠된 원의 행과 이름 목록이 아래에 표시됩니다. 원을 굴리면 원과 이름이 모두 강조 표시됩니다. 마찬가지로 이름을 롤오버하면 원과 이름이 모두 강조 표시됩니다. 코드가 각 목록 항목에 고유 ID가 첨부된 매우 단순한 순서 없는 목록임을 알 수 있습니다. 물론, CSS3는 이것을 더 쉽게 만들어줄 것이고 고유한 ID의 필요성을 없애줄 것이지만, 그것은 별개의 문제이다. Red Yellow Orange Green Blue 그런 다음 목록 항목에 크기와 위치에 대한 일반적인 정보를 제공합니다.. 2021. 9. 28.
아름답고 기능적인 10개의 RED 웹 레이아웃 때때로 다른 사이트를 보는 것이 여러분이 필요로 하는 모든 영감입니다! 여기 기능성에 초점을 맞춘다고 느끼는 멋지게 디자인된 사이트들이 있습니다. 이 게시물은 빨간색으로 표시됩니다. (10개의 아름답고 기능적인 파란색 웹 레이아웃 참조) 크림슨 폭스 크리에이티브 스튜디오 불평하는 것이 좋다 레지네스 파티셰리 헬디자인 브리든 YMCA 리암스키의 아리안 대모 백업 붉은 개미 카메론 몰의 포트폴리오 2021. 9. 28.