1. 首頁
  2. 問答
  3. Smarty的管理頁面HTML解析

Smarty的管理頁面HTML解析

2017-02-27 60 views
-2

這個腳本Smarty的管理頁面HTML解析

{else} 
{$obj->mMenus[i].name}

是DIV。第一行是好的，其他行名稱向右，div標籤消失。這是因爲聰明的人。我的網格是正確的。

這裏開始我的問題

{}其他 

  <div class="grid_1">     

       {$obj->mMenus[i].name} 
      </div>

在這裏結束我的問題

下面是完整的模板：

<form method="post" action="admin.php"> 
    <div class="container"> 
     <div class="grid_6 last"> 
     ... 
     </div> 

     <div class="grid_1"> 
      ... 
     </div> 
     <div class="grid_3"> 
      ..... 
     </div> 
     <div class="grid_1"> 
      ..... 
     </div> 
     <div class="grid_1 last"> 
      .... 
     </div> 
    </div> 
    <div class="container"> 
     <div class="grid_6 last"> 
      ...... 
     </div> 
    </div> 


    ....... 
     <p class="no-items-found">menus...!</p> 
    ...... 
     <div class="container"> 
      <div class="grid_1"> 
       Menu Name 
      </div> 
      <div class="grid_3"> 
       Menu Content 
      </div> 
      <div class="grid_1"> 
       Menu Published 
      </div> 
      <div class="grid_1 last"> 
       &nbsp; 
      </div> 
     </div> 



     ..... 
      <div class="container">   
       <div class="grid_1"> 
        ....... 
       </div> 
       <div class="grid_3"> 
        ....... 
       </div> 
       <div class="grid_1"> 
        ....... 
       </div> 
       <div class="grid_1 last"> 
        ........ 
        ........ 
       </div> 
      </div> 
     {else} 
      <div class="container">  
       <div class="grid_1">     
        ...... 
       </div> 
       <div class="grid_3"> 
        ...... 
       </div> 
       <div class="grid_1"> 
        ..... 
       </div> 
       <div class="grid_1 last"> 
        ...... 
        ....... 
       </div> 
      </div> 
     ...... 
</form>

模板的結束。

我現在看到，在這段代碼中div不會消失，而且會命名爲gos。 源頁的看法是：

<div class="container">  
<div class="grid_1">     

       ....... 
      </div>

.......

<!DOCTYPE html> 
<html> 
    <head> 
    <title>Authentication</title> 
    <meta charset="UTF-8"> 
    <link type="text/css" rel="stylesheet" href="accessories/styles/kartedium.css"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    </head> 
    <body> 



<form method="post" action="admin.php"> 
     <div class="container"> 
       <div class="grid_6 last"> 
       ..... 
        ..... 
       </div> 

       <div class="grid_1"> 
        ...... 
       </div> 
       <div class="grid_3"> 
        ...... 
       </div> 
       <div class="grid_1"> 
        ....... 
       </div> 
       <div class="grid_1 last"> 
        ..... 
       </div> 
     </div> 
     <div class="container"> 
       <div class="grid_6 last"> 
       ..... 
       </div> 
     </div> 



     <div class="container"> 
       <div class="grid_1"> 
        Menu Name 
       </div> 
       <div class="grid_3"> 
        Menu Content 
       </div> 
       <div class="grid_1"> 
        Menu Published 
       </div> 
       <div class="grid_1 last"> 
        &nbsp; 
       </div> 
     </div> 




              <div class="container">  


       <div class="grid_1">     

        ..... 
       </div> 


       <div class="grid_3"> 
        <p> 
.... 


<p>....... 
       </div> 
       <div class="grid_1"> 
        2017-02-26 
       </div> 
       <div class="grid_1 last"> 
        ...... 
       </div> 
    </div> 
             <div class="container">  


       <div class="grid_1">     

       ...... 
       </div> 


       <div class="grid_3"> 
        <p> 
...... 


....... 

       </div> 
       <div class="grid_1"> 
        2017-02-26 
       </div> 
       <div class="grid_1 last"> 
        <input type="submit" 
     ..... 
     ...... 
       </div> 
    </div> 
             <div class="container">  


       <div class="grid_1">     

       ...... 
       </div> 


       <div class="grid_3"> 
        <p> 
.....

......

   </div> 
       <div class="grid_1"> 
        2017-02-26 
       </div> 
       <div class="grid_1 last"> 
        ...... 
       </div> 
    </div> 
             <div class="container">  


       <div class="grid_1">     

        ....... 
       </div> 


       <div class="grid_3"> 
        <p> 
...... 



..... 
       </div> 
       <div class="grid_1"> 
        2017-02-26 
       </div> 
       <div class="grid_1 last"> 
        ..... 
     ..... 
       </div> 
    </div> 
             <div class="container">  


       <div class="grid_1">     

        ..... 
       </div> 


       <div class="grid_3"> 
        <p> 
.....

......

   </div> 
       <div class="grid_1"> 
        2017-02-26 
       </div> 
       <div class="grid_1 last"> 
        .... 
     ..... 
       </div> 
    </div> 
             <div class="container">  


       <div class="grid_1">     

        ..... 
       </div> 


       <div class="grid_3"> 
        <p>

.....

..... 

       </div> 
       <div class="grid_1"> 
        2017-02-26 
       </div> 
       <div class="grid_1 last"> 
        .. 
     .... 
       </div> 
    </div> 
             <div class="container">  


       <div class="grid_1">     

        .... 
       </div> 


       <div class="grid_3"> 
        <p> 
...... 

       </div> 
       <div class="grid_1"> 
        2017-02-25 
       </div> 
       <div class="grid_1 last"> 
        .... 
     .... 
     .... 
       </div> 
    </div> 
             <div class="container">  


       <div class="grid_1">     

        .... 
       </div> 


       <div class="grid_3"> 
        <p>

.....

..... 
       </div> 
       <div class="grid_1"> 
        ..... 
       </div> 
       <div class="grid_1 last"> 
        ...... 
       </div> 
    </div> 

       </form> 

    </body> 
</html>

完整的源頁面的結束。

完整的CSS：

body { 
    font-family: 'Nunito', sans-serif; 
    font-weight: 100; 
    font-size: 1em; 
    color: #faf3bc; 
    background-color: #0976B2; 
} 

.grid_1 { width: 15.625%; } /* 125px/800px = 15.625% */ 
.grid_2 { width: 32.5%; } /* 260px/800px = 32.5% */ 
.grid_3 { width: 49.375%; } /* 395px/800px = 49.375% */ 
.grid_4 { width: 65.625%; } /* 525px/800px = 65.625% */ 
.grid_5 { width: 83.125%; } /* 665px/800px = 83.125% */ 
.grid_6 { width: 100%; } /* 800px/800px = 100% */ 

.grid_1, 
.grid_2, 
.grid_3, 
.grid_4, 
.grid_5, 
.grid_6 { 
    margin-right: 1.25%; 
    float: left; 
    display: block; 
} 
.last {margin-right:0; } 

.container{ 
    width: 90%; 
    max-width: 800px; 
    padding: 4% 0; 
    margin: auto; 
} 
img { 
    max-width: 100%; 
} 
h1 { 
    font-size: 2.750em; 
    line-height: 1.25em; 
    font-weight: 100; 
    letter-spacing: -2.75px; 
    color: #ffffff; 
} 

a:link {color:#b4c34f; text-decoration:none;}  /* unvisited link */ 
a:visited {color:#b4c34f; text-decoration:none;} /* visited link */ 
a:hover {color:#faf3bc; text-decoration:underline;} /* mouse over link */ 
a:active {color:#b4c34f; text-decoration:none;} /* selected link */ 

a.selected {color:#ffffff;} /* selected link */ 

ul { 
    list-style-type:none; 
} 
    @media screen and (max-width : 705px) { 
.grid_1, 
.grid_2, 
.grid_3, 
.grid_4, 
.grid_5, 
.grid_6 { 
    width: 100%; 
}}

CSS

來源

2017-02-27 b2ok

+0

職高中。 {/ if}最後。所有像grid之前一樣工作，就像在表格中一樣，除了沒有好的解析HTML，不需要在名稱周圍使用div標籤，並且沒有div的名字上去。 – b2ok

+0

我提供了更多的代碼。 – b2ok

+0

可能的重複[如何使用CSS並排浮動3個div]（http://stackoverflow.com/questions/2156712/how-to-float-3-divs-side-by-side-using-css） – NineBerry

回答

1

結束時，你有你的CSS問題。

當您使用float：left來水平放置容器中的div時，您需要將clear屬性添加到容器以阻止容器浮動。

改變容器類這樣的：

.container{ 
    clear:both; 
    width: 90%; 
    max-width: 800px; 
    margin-left: auto; 
    margin-right: auto; 
    margin-top: 4%; 
}

參見How to float 3 divs side by side using CSS

來源

2017-02-28 15:30:14 NineBerry

+0

超級NineBerry！你解決了問題！我已經添加了明確的屬性，但在行後面。鼓掌爲你，非常感謝你！ – b2ok

相關問題

 相關問題