【问题标题】:Styling code within phpphp中的样式代码
【发布时间】:2012-11-25 07:57:59
【问题描述】:

我无法设置从数据库中提取的信息的样式。如果有人可以提供帮助,我将不胜感激。我尝试在 while 循环中定义 $style,然后将其分配给 $questions,但网页上没有任何反应。我是一般编码的新手,虽然我对 css 有一些了解,但我不知道你如何在 php 脚本中使用它。

我试图在每个问题后面放置的背景风格*

#frm1
        {
            background: #D9D9D9;
            margin:auto;
            top:150px; left:200px; width:880px; height:60px;
            position:absolute;
            font-family: "Comic Sans MS", cursive, sans-serif;
            font-size: 9px;
            font-style: italic;
            line-height: 24px;
            font-weight: bold;
            text-decoration: none;
            -webkit-border-radius: 10px;
            -moz-border-radius: 10px;
            border-radius: 10px;
            padding:10px;
            border: 1px solid #999;
            border: inset 1px solid #333;
            -webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.5);
            -moz-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.5);
            box-shadow: 0px 0px 40px rgba(0, 0, 0, 0.7);
         }

PHP 代码从数据库中检索信息*

if (mysql_num_rows($result) >= 0)
    {
        $toggle = false;
        while ($rows = mysql_fetch_array($result, MYSQL_ASSOC) and $i<10 ) 
             {
                        $i++;
                        $toggle = !$toggle;
                        if($toggle)
                        $style = "id:frm1;";
                        else
                        $style = "background: white;";

                        questions .= "<a style='$style'> </a>";
                        questions .= "Titlee: " ."<a href='show_question2.php?question_id=" . $rows["question_id"] . "'>". $rows['title'] . "</a> <br> ";
                        questions .= "Details: " . "<a href='show_question2.php?question_id=" . $rows["question_id"] . "'>". $rows['detail'] . "</a> <br>  ";
                        questions .= "Category: " . "<a href='show_question2.php?question_id=" . $rows["question_id"] . "'>". $rows['categories'] . "</a> <br> <br> <br> ";
                    }
                    echo  questions;
                } 

【问题讨论】:

  • 你应该改用类;他们将提供更简洁的代码和更大的灵活性。无论如何,这里的问题似乎是带有样式的链接是空的......
  • CSS 类将大大简化这一点。正如您在这里所拥有的那样,您实际上使用的是&lt;font&gt; 标签。
  • 我尝试使用 CSS 类,但我不知道如何在 php 中调用它们。
  • style='id:frm1' 不正确;你想要 id='frm1'
  • 您应该使用 class 而不是 id。ID 在页面上应该是唯一的。

标签: php html mysql css styles


【解决方案1】:

这将起作用:

if (mysql_num_rows($result) >= 0) {
    $toggle = false;
    while ($rows = mysql_fetch_array($result, MYSQL_ASSOC) and $i<10 ) {
        $i++;
        $toggle = !$toggle;
        if($toggle)
        $style = "background: #D9D9D9;"; else
        $style = "background: green;";

        questions .= "<a href='#' style='display:block;$style'> </a>";
        questions .= "Titlee: " ."<a href='show_question2.php?question_id=" . $rows["question_id"] . "'>". $rows['title'] . "</a> <br> ";
        questions .= "Details: " . "<a href='show_question2.php?question_id=" . $rows["question_id"] . "'>". $rows['detail'] . "</a> <br>  ";
        questions .= "Category: " . "<a href='show_question2.php?question_id=" . $rows["question_id"] . "'>". $rows['categories'] . "</a> <br> <br> <br> ";
    }
    echo  questions;
}

问题是您的 a-tag 没有 href 属性,并且由于它是内联显示的(默认行为),因此 background CSS 属性将不起作用。

【讨论】:

    【解决方案2】:

    虽然我对 css 有一些了解,但我不知道你是如何在其中使用它的 php脚本。

    好的。

    您的 PHP 脚本是服务器上的 PHP 脚本,并为用户生成一个常规的 HTML 页面。 [看到答案的底部,我会尽力给你一个快速的概述]

    您可以像使用普通 HTML 页面一样使用 CSS,尽管有 PHP 支持,它也能正常工作。

    这意味着不要使用 style="$style"。样式属性不好。

    看起来你想有条件地构建你的 CSS,我的建议是:

    • 使用 PHP 更改一个类,并拥有一个作用于该类的外部样式表
    • 将您有条件更改的样式放在标题中的 &lt;style&gt; 标记中,然后使用 PHP 更改这些样式。

    此答案将使用第一个选项 (编辑以考虑新信息)

    在您的 PHP 代码中,在您的链接之前:

    if($toggle) {
        $questions.='<div id="frm1">';
    }
    else {
        $questions.='<div id="frm2">';
    }
    

    在您的 PHP 代码中,在您的链接之后:

     $questions .= "</div>";
    

    最后,在您的外部样式表中,或者在您的头脑中&lt;style&gt; 标签中:

    #frm1 {
       ...
    }
    #frm2 {
       ...
    }
    



    服务器端语言概览

    所以,网络编程。这通常通过两种方式完成。 客户端(阅读:javascript)和服务器端(在您的情况下,阅读:php,但还有更多内容)。

    使用像 javascript 这样的客户端语言,代码实际上会被发送到网络浏览器。然后,Web 浏览器会根据脚本要求它执行的操作来修改页面的内容。这意味着您的用户可以看到代码,甚至可以在他们的 Web 浏览器中将其关闭或在其位置执行其他 javascript。

    使用服务器端语言有不同的工作流程。

    1. 用户请求您的网页(由其 URL 标识)
    2. 网络服务器(阅读:您的虚拟主机)收到此请求,并查找网页是什么
    3. 发现网页是php页面,服务器执行php代码
    4. php 代码为服务器提供了一个 html 页面(您已经构建了该页面,如您所见,您的 php 脚本输出 HTML)
    5. 服务器将生成的 html 代码发送给用户

    请注意,Web 浏览器是执行所有 HTML 和 CSS 处理的组件,它永远不会看到 php.ini 文件。当您的 php 脚本到达您的用户时,它只是一个 html 页面。

    因为网络浏览器只能看到一个 HTML 页面,所以在您的 php 脚本上使用 CSS 与在常规 HTML 页面上使用 CSS 在功能上没有区别。

    【讨论】:

    • 非常感谢您的广泛回答。我用我试图在每个问题后面使用的实际背景更新了我的问题。我之前把它省略了,因为我认为只用颜色背景来问这个问题会更容易。我知道 css 在 php 中产生的结果与在 html 中产生的结果相同,但您似乎必须以不同的方式对其进行编码。如果我在 html 中,我会做类似
      但 div 标签似乎在 php 中不起作用。
    • 它仍然可以正常工作 - ...
      '); ?>
  • 即完全按照您在 HTML 中执行的操作,但使用 PHP 有条件地更改 ID(或完全删除,或其他),如上面简化示例中给出的。顺便说一句,尝试在您的网络浏览器中查看您的 HTML 源代码(Ctrl+U ?),看看它是否正确——如果它的输出与您编写纯 HTML 页面的结果不完全一样,那么这就是它不正确的原因不工作。
  • 【解决方案3】:

    构建类并在 css 中定义它们,而不是样式。

    if ($toggle)
         $questionClass="redBackground";
    else
         $questionClass="greenBackground";
    $questions.="<a class='$questionClass'>";
    

    另外,一定要研究 mysqli 或 pdo。 mysql_ 函数已被弃用,几乎没有那么酷!

    【讨论】:

    • 切换到 mysql 或 pdo 会有什么不同?我希望在开始学习如何与 MYSQL 交互之前做更多的研究,但在这一点上,我可能会坚持使用 mysql,直到我熟悉 HTML 和 PHP,然后再切换到 MYSQLi 或 PDO。但我很感激你的建议。
    • 它不仅更安全,而且最终您的代码将停止工作,因为 mysql_ 函数已被弃用。 (这意味着它们现在仍然有效,但在即将发布的版本中将完全删除。)另外,如果你想做面向对象的 PHP 编程,你几乎肯定会在某个时候这样做,你肯定会想为你的数据库使用对象交易。
    【解决方案4】:

    你可以做到——

    if (mysql_num_rows($result) >= 0)
    {
        $toggle = false;
        while ($rows = mysql_fetch_array($result, MYSQL_ASSOC) and $i<10 ) 
             {
                        $i++;
                        $toggle = !$toggle;
                        if($toggle)
                          $style = "bg";
                        else
                          $style = "bg_green";
                        echo("<a class='".$style."'> </a>");
                        echo("Titlee: " ."<a href='show_question2.php?question_id=" . $rows["question_id"] . "'>". $rows['title'] . "</a> <br> ");
                        echo("Details: " . "<a href='show_question2.php?question_id=" . $rows["question_id"] . "'>". $rows['detail'] . "</a> <br>  ");
                        echo("Category: " . "<a href='show_question2.php?question_id=" . $rows["question_id"] . "'>". $rows['categories'] . "</a> <br> <br> <br> ");
    
    
              } 
    

    在这个文件中添加 -

    <style type="text/css">
        .bg {
             background: #D9D9D9;
          }
          .bg_green {
             background: green;
          }
    </style>
    

    【讨论】:

      【解决方案5】:

      您可以在计数器上交替使用 $i$i % 2 以在两个 CSS 类之间切换。这将为您提供0, 1, 0, 1, 0, 1, ...,因此依次选择第一个和第二个 CSS 类名称。

      PHP:

      $css_class = array('frm1', 'second');
      while ($rows = mysql_fetch_array($result, MYSQL_ASSOC) and $i<10 )
      {
          $i++;
          questions .= "<a class='$css_classes[$i % 2]'> </a>";
          questions .= "Titlee: " ."<a href='show_question2.php?question_id=" . $rows["question_id"] . "'>". $rows['title'] . "</a> <br> ";
          questions .= "Details: " . "<a href='show_question2.php?question_id=" . $rows["question_id"] . "'>". $rows['detail'] . "</a> <br>  ";
          questions .= "Category: " . "<a href='show_question2.php?question_id=" . $rows["question_id"] . "'>". $rows['categories'] . "</a> <br> <br> <br> ";
      }
      

      并在您的 CSS 文件中定义这两个类

      .frm1 {
          background: #D9D9D9;
          margin:auto;
          top:150px; left:200px; width:880px; height:60px;
          position:absolute;
          ...
      }
      
      .second {
          background: white;
      }
      

      【讨论】:

      • 好的,我认为我最初的问题很糟糕,我已经更新了它。我不是想获得一个交替的背景,而是每个问题背后的相同背景(#frm1)。
      • @user203837 你仍然在两种样式之间切换,所以只是不同的 CSS 样式。我相应地更新了我的答案。如果这仍然不是您想要的,请展示一个 HTML 示例它应该是什么样子。
      【解决方案6】:

      正如本所说,使用类。

      首先创建一个类

      <style>
      .gray{background: #D9D9D9;}
      .green{background: green;}
      </style>
      

      那就试试这个

      if (mysql_num_rows($result) >= 0)
          {
              $toggle = false;
              while ($rows = mysql_fetch_array($result, MYSQL_ASSOC) and $i<10 ) 
                   {
                              $i++;
                              $toggle = !$toggle;
                              $style = ($toggle)?"green":"gray";
      
                              $questions .= "<a class='".$style."'> Put some thing here </a>";
                              $questions .= "Titlee: " ."<a href='show_question2.php?question_id=" . $rows["question_id"] . "'>". $rows['title'] . "</a> <br> ";
                              $questions .= "Details: " . "<a href='show_question2.php?question_id=" . $rows["question_id"] . "'>". $rows['detail'] . "</a> <br>  ";
                              $questions .= "Category: " . "<a href='show_question2.php?question_id=" . $rows["question_id"] . "'>". $rows['categories'] . "</a> <br> <br> <br> ";
                          }
                          echo  $questions;
          }
      

      请尝试一下,我没有测试过,但它应该可以工作,根据您的需要。

      【讨论】:

      • 这似乎只是突出显示我在第一个 $questions.=... 的“放一些东西”空间中放置的任何内容。问我的问题,但我想做的是在 3 行(标题、详细信息和类别)后面做一个坚实的背景。我用我试图放在每个完整问题后面的背景 css 更新了我的代码......
      猜你喜欢
      相关资源
      最近更新 更多
      热门标签