2012-09-27 2 views
0

Forewarning : 나는 CSS가 좋지 않습니다.스타일 포스트 수는 다양 할 수 있습니까?

안녕하세요, 최근 게시물 3 개를 표시하는 작은 게시판을 작성 중입니다. 사용자가 한 화면에 표시되는 게시물 수를 선택하고 싶습니다. 5 개 또는 10 개의 게시물을 말합니다.

while ($i < $d){ 
// $d is entered by the user to determine how many posts are to be displayed. 
    if ($i == $id_Max){ 
     echo "Reached last known post."; 
     break; 
    } 

    $query2 = $con->prepare(
    "SELECT postName, postPath FROM " . $table . 
    " WHERE id=(SELECT MAX(id-".$i.") FROM " . $table . ")" 
    ); 
    $query2->execute(); 
    $result2 = $query2->fetch(); 
    $path = $result2["postPath"]; 
    $file = file_get_contents($path); 

    echo "<article class = 'entry'>"; 

    echo "<section id = 'entryTitle'>"; 
    echo $result2["postName"] . "<br />"; 
    echo "</section>"; 

    echo $file; 
    echo "<br />"; 

    echo "</article>"; 

    $i++; 
} 

그래서, 인쇄 각 게시물은 entry의 클래스가 : 모든 게시물이 방식으로 인쇄되도록

현재 내가 가지고있다. 이것으로 나는 각 포스트에게 국경을 주었지만 그들 사이에 약 5px의 공간이 있도록 그것을 만들고 싶다. position: relativetop: 5px을 설정했지만 맨 위의 항목에서만 효과가 있으며 페이지의 맨 위에서 5px 아래로 모두 이동합니다.

본질적으로 나는 가능한 모든 게시물에 대해 무언가를 써야하는 일없이 전 세계적으로 어떤 일을하고 싶습니다. #entry1, #entry2 ...

저는이 특정 작업을 수행하는 방법이 실제로는 아니지만 앞으로 더 많은 것을 배울 수 있습니다.

감사합니다, - 마이클 미첼

(I가 명확하지 않으면, 나에게 말해 내가 더 잘 설명하려고 시도하시기 바랍니다.)

'최고'CSS 속성은 일반적으로 단지와 요소에 적용
+1

CSS로 'article.entry'에'margin '을 넣으려고 했습니까? 'article.entry {margin : 10px 0; }'? – Jon

+0

감사합니다. 이것은 완벽하게 작동합니다! :) – MichaelMitchell

답변

0

여기에 잘못된 점이 몇 가지 있습니다. 모든

먼저, 요소들 사이의 간격은 일반적으로 여백 처리됩니다 : 당신이 정말로해야 할 때 데이터베이스에 여러 요청을하고있다처럼

/* all .entry elements */ 
.entry { margin-top: 10px } 
/* all but the first .entry elements */ 
.entry + .entry { margin-top: 10px } 

둘째, 그것은 보인다. 당신이 원하는 쿼리는 다음과 같습니다

SELECT postName, postPath FROM tablename ORDER BY date_added DESC LIMIT ? 

이 당신을 통해 반복하고 다수의 요청을보다 훨씬 빠르게 할 수있는 상위 항목의 목록을 제공합니다. 항목 수를 구성 가능한 상태로 되돌리려면 값을 살균/이스케이프 처리해야합니다.

+0

고마워! 나는 우리가 그것에있는 동안 조금 다른 질문을 가지고있다. > 연산자는 CSS에서 처럼 수행합니다. '.mainPosts> #mainPostsHeader {}' 어떤 특정 작업을 수행 할 수 있습니까? – MichaelMitchell

+0

'>'selector는 "직접적인 자손"입니다. 즉,'# mainPostsHeader'는'의 자식입니다.mainPosts'가 아니라 손주 또는 증손자 (자손을 원하면'.mainPosts # mainPostsHeader')를 사용하십시오. 일반적으로 ID는 페이지에 고유해야하기 때문에 타겟팅 할 수 없습니다 (여러 개가있는 경우 JS에서 예기치 않은 결과가 발생할 수 있음). – cimmanon

0

절대 위치. 당신은 엔트리 클래스가 가지고 싶은 것이 있습니다

margin-bottom:5px; 

또는

margin-top:5px; 

난 당신이이 작업을 수행하기 위해 position:relative 속성을 필요가 있다고 생각하지 않습니다.

관련 문제