플로이드
오리지널 포스터- 2005년 4월 7일
- 몬테레이 멕시코
- 2006년 3월 27일
두 개의 div가 있습니다. 하나는 고정 높이이고 다른 하나는 창의 나머지 수직 공간을 채우고 싶습니다. 후자 div의 높이를 100%로 설정하면 창과 같은 높이가 되지만 창의 높이에서 첫 번째 div의 높이를 뺀 값으로 하고 싶습니다.
이것은 내가 사용하는 코드입니다.
코드: |_+_|
또한 내가 하고 싶은 것과 지금까지 할 수 있었던 것을 보여주는 몇 가지 이미지를 포함했습니다. 미리 감사드립니다
첨부 파일
N
NoName브랜드
- 2005년 11월 17일
- 핼리팩스, 캐나다
- 2006년 3월 27일
그렇지 않으면 원하는 것을 얻을 수 있는 방법이 생각나지 않습니다.
스티브
- 2004년 10월 13일
- 영국
- 2006년 3월 27일
노력하다:
제목 없는 문서
에게
NS
씨
NS
그리고
추신: 저는 DW에서 이를 수행하고 두 번째 레이어에 일부 콘텐츠를 추가한 다음 코드를 엉망으로 만들어 속였습니다. DW는 가장자리에 패딩이 있는 것을 좋아하고 대화 상자에서 레이어를 지정할 수 있음에도 불구하고 상단 모서리에서 0px부터 시작하려면 코드 보기를 사용하여 두 번 알려야 합니다. 어쨌든 해야 했다.
플로이드
오리지널 포스터- 2005년 4월 7일
- 몬테레이 멕시코
- 2006년 3월 27일
NoNameBrand는 다음과 같이 말했습니다: 첫 번째를 두 번째 안에 중첩하지 않는 이유는 무엇입니까?
그렇지 않으면 원하는 것을 얻을 수 있는 방법이 생각나지 않습니다.
덕분에 시각적으로 작동하지만 두 번째 div는 이 레이아웃의 컨테이너가 되므로 콘텐츠가 상속할 수 있도록 적절한 크기가 필요합니다.
그렇다면 단순히 불가능할까요? 아마도 작동하려면 약간의 자바 스크립트를 사용해야합니까?
스티브가 말했다: 시도:감사합니다. 작동하게 만들지 못했습니다. 어떤 브라우저를 사용하셨나요?
플로이드
오리지널 포스터- 2005년 4월 7일
- 몬테레이 멕시코
- 2006년 3월 27일
좋아, 여기 내 궁극적인 목표의 사진이 있습니다. 지금까지 차근차근 해왔기 때문에 초기 접근 방식이 문제일 수도 있습니다. 그럼 여러분은 어떻게 접근하시겠습니까? (나는 아이디어가 필요합니다)? 순수한 CSS를 사용하시겠습니까, 아니면 테이블이나 프레임을 사용하시겠습니까?
첨부 파일
스티브
- 2004년 10월 13일
- 영국
- 2006년 3월 27일
가지고 놀아야 할 비트는 다음과 같습니다.
#레이어1 {
위치:절대;
왼쪽:0px;
상단:0px;
너비: 100%;
높이:180px;
z-인덱스: 1;
배경색: #99CCFF;
}
용지에 페이지를 거칠게 하여 올바른 위치를 얻으면 각 레이어의 상단 LH 모서리 위치를 알 수 있습니다. 레이어 1의 높이는 레이어 2의 시작 위치를 결정합니다. 이 경우 레이어 2는상단:180px;코드 줄.
마지막 게시물에 표시된 것처럼 3개의 레이어를 원하면 가장 왼쪽 레이어는 다음과 같습니다.
#레이어1 {
위치:절대;
왼쪽:0px;
상단:0px;
너비: 200픽셀;
높이: 100%;
z-인덱스: 1;
배경색: #336699;
}
최상위 RH 레이어는 다음과 같습니다.
#레이어1 {
위치:절대;
왼쪽:200픽셀;
상단:0px;
너비: 100%;
높이:180px;
z-인덱스: 2;
배경색: #33CCFF;
}
창의 나머지 부분을 채울 세 번째 레이어(크기는 조정됨)는 다음과 같아야 합니다.
#레이어1 {
위치:절대;
왼쪽:200픽셀;
상단:180px;
너비: 100%;
높이: 100%;
z-인덱스: 3;
배경색: #99CCFF;
}
Dreamweaver를 사용하는 경우 레이어가 페이지 보기에서 아무것도 축소되지 않아 위의 원본 html에서 'a,b,c 등'이 되는 경우를 대비하여 각 레이어에 더미 콘텐츠를 넣는 것이 가장 좋습니다.
ps. 저는 전문가가 아니라 틀릴 수도 있지만 도움이 되었으면 합니다. 내가 말할 수 있는 것은 내 첫 번째 코드가 작동하는 것 같다는 것입니다. 조금이나마 도움이 된다면 개인적으로 레이어를 중첩하지 않겠지만 저만 그렇습니다. 저는 단순하게만 합니다. N
NoName브랜드
- 2005년 11월 17일
- 핼리팩스, 캐나다
- 2006년 3월 27일
내가 할 일은 다음과 같습니다.
암호:
푸 너는 믿는다!
-
- 2003년 6월 14일
-
-
- MD/VA/DC
- 2006년 3월 27일
디컨셉트 ...
FlashObject를 확인하고 다운로드에 div 전체 화면을 만드는 코드가 있습니다. 원하는 대로 조정할 수 있습니다.
http://blog.deconcept.com/flashobject/ 플로이드
오리지널 포스터 -
- 2005년 4월 7일
-
-
- 몬테레이 멕시코
- 2006년 4월 28일
모든 도움을 주셔서 감사합니다. 그러나 고정 너비/높이 및 백분율의 조합으로 내가 원하는 정확한 레이아웃을 달성하는 것이 불가능하다는 것을 방금 깨달았습니다. 백분율만 사용하여 다시 작성했는데 이제 작동합니다. 마크업에 관심이 있으시면 알려주시면 게시하겠습니다. 스티브
-
- 2004년 10월 13일
-
-
- 영국
- 2006년 4월 28일
floyde는 다음과 같이 말했습니다: 마크업에 관심이 있는 경우 저에게 알려주시면 게시하겠습니다.
시간이 되시면 다시 한번 포스팅 해보고 싶습니다.
NoNameBrand는 다음과 같이 말했습니다: 이 '레이어' 항목은 무엇입니까? Dreamweaver와 유사한 '휴식 시간'이 정말 좋은가요?
글쎄, 나는 '브레이킹 것들'에 대해 모르지만 내가 CSS boff가 아니라는 것을 당신이 의심했을 것입니다 - 레이어는 'CSS 위치 지정 요소'라고 불러야 한다고 생각하는 것들에 DW가 부여한 편리한 이름입니다 - 그리고 저와 같은 DTP/포토샵 배경의 사람들이 좀 더 편안하게 느끼도록 하기 위해 그렇게 부르는 것 같아요. NoNameBrand 게시물에 포함된 코드를 보면 내 코드보다 훨씬 더 우아합니다. div 태그를 이해하는 데 정말 힘써야 할 것입니다. OP와 답변에 감사드립니다. N NoName브랜드
-
- 2005년 11월 17일
-
-
- 핼리팩스, 캐나다
- 2006년 4월 28일
stevep은 다음과 같이 말했습니다: 글쎄, 나는 '중요한 것들'에 대해 모르지만 당신은 내가 CSS boff가 아니라는 것을 의심했을 것입니다 - 레이어는 'CSS 위치 지정 요소 '
그들은 또한 페이지에서 앞뒤로 배치하는 z-색인을 쌓았습니다. 나는 DW 레이어가 사이트를 완전히 망가뜨리기 전에 본 적이 있지만 그렇지 않은 경우에는 DW 레이어에 많이 노출되지 않았습니다(정말로 충분했습니다).
div 태그 주위에 정말로 머리를 맞대고 찔러야 할 것입니다.
A는 임의의 블록일 뿐입니다. 의미상 아무 의미가 없습니다.(텍스트의 단락) 않습니다. NS같은 생각이지만 인라인 항목의 경우(예: 태그이지만 다시 의미는 없음).
이 내용을 배우기 위해 가장 쉬운 방법은 Dreamweaver 사용을 중단하는 것입니다. Photoshop에서 사이트를 디자인한 다음 원하는 그래픽 요소를 저장하고 색상 코드와 정렬 목적을 위한 대략적인 픽셀 측정을 기록한 다음 TextWrangler 또는 VIM에서 사이트를 코딩합니다. 플로이드
오리지널 포스터 -
- 2005년 4월 7일
-
-
- 몬테레이 멕시코
- 2006년 4월 28일
Stevep은 다음과 같이 말했습니다: 다시 게시할 시간이 있다면 한 번 뵙고 싶습니다.
여기 있습니다, 거기에는 약간의 스페인어가 있습니다. 너무 혼란스럽지 않기를 바랍니다.
암호:Grand Scheme html { 높이: 100%; } 본문 { 여백: 0; 패딩: 0; 높이: 100%; 너비: 100%; } #left, #right { float: left; } #left { 높이:100%; 배경색: 주황색 너비: 10%; } #right { 높이: 100%; 위치:상대적; 너비: 90%; } #top { 배경색: 파란색; 높이: 10%; } #fotos { 위치: 상대; 높이: 90%; } #foto_sup_izq, #foto_sup_der, #foto_inf_izq, #foto_inf_der { 높이: 50%; 너비: 50%; 오버플로: 자동; 위치: 절대; } #foto_sup_izq, #foto_sup_der { 상단: 0; } #foto_sup_der, #foto_inf_der { 왼쪽: 50%; } #foto_inf_izq, #foto_inf_der { 상단: 50%; } 
첨부 파일
인기 게시물