樣式化PHP表單<input type=“submit”>

Question

所以我試圖將一些CSS樣式添加到php表單中，我有以下CSS

#button {
  font-size: 14;
  border:none;
  width:20ex;
  height:10ex;
  outline: none;
}

我想將其添加到使用id="button"屬性在網頁的p php元素內構建的表單中。

根據我的閱讀，這應該可行。

$list = '';
while($row = $result->fetch_assoc()){
$title = $row['title'];
$id = $row['id'];
$summary = $row['summary'];
//I'm assuming you want each link to be different here...
$list.='<div class="Select_Course"><form name="courseselect" method="post" action="selectedcourse.php">
        <input type="submit" name="subsearch" value="' .$title. '" id="button">
        <input name="submitcourseselection" type="text" value="'.$title.'"hidden> 
        </form>
        <p>' . $summary . '</p></div>';
} 

但是，它不會將CSS中的樣式#button應用於此按鈕。

我該怎么辦？

提前致謝。

Answer 1

您可以更改CSS提交到此。 代替使用id按鈕

input[type=submit] {
    padding:5px 15px; 
    font-size: 14px;
    border:none;
    width:20ex;
    height:10ex;
    outline: none;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px; 
}

Answer 2

這應該工作

input[type="submit"] {
    font-size: 14;
    border:none;
    width:5em;
    height:2.5em;
    outline: none;
}

Answer 3

您的問題是CSS度量單位， ex在CSS中無效。 也許您的意思是px或em但我根據您提供的值大小猜測px 。 這應該可以解決問題

#button {
  font-size: 14px; /*added px*/
  border:none;
  width:20px; /*changed to px*/
  height:10px; /*same as above*/
  outline: none;
}

Answer 4

嘗試使用按鈕標簽，然后將css添加到它的id中。 您可以通過javascript $（＃yourid）.click（function（）{//您的操作在此處進行。

Answer 5

以下代碼在Firefox中為我工作（對於此示例，由於我不知道您的數據庫，因此我在使用$ i，並且將字體大小更改為15並回顯了列表）

<style>
#button{
font-size: 15;
border:none;
width:20ex;
height:10ex;
outline: none;
}
</style>

<?php
$list = '';
$i=0; //For this example i am using $i since I do not know your Database 
while($i<6){
$title = 'Title-'.$i;// change this to your database variable $row['title']
$id = $i;// change this to your database variable $row['id']
$summary = 'Summary: '+$i;// change this to your database variable $row['summary']
//I'm assuming you want each link to be different here...
$list.='<div class="Select_Course">
    <form name="courseselect" method="post" action="selectedcourse.php">
    <input type="submit" name="subsearch" value="' .$title. '" id="button">
    <input name="submitcourseselection" type="text" value="'.$title.'"hidden> 
     </form>
    <p>'.$summary.'</p>
    </div>';    
$i++;   

echo $list;
} 
?>

Answer 6

您也可以使用id，但是在CSS中，您需要添加以下代碼：

input[id="button"] {
    font-family: "Calibri";
    font-size: 18px;
    background-color:#FF4500;
}