每次图像的高度和宽度都相同

时间:2015-03-15 16:00:30

标签: php html css

目前我创建了一个小图片上传系统。但我希望每张照片看起来都一样。例如我上传一张图片(500x500)然后我必须用css最小化图片。我有一个班级

.picture{
width: 30%;
height: 30%;
}

但是每张照片的大小都各不相同。想要一个固定的高度和宽度但不是这样的:

.picture{
width: 200px;
height: 200px;
}

我想这样做:Link 在这个页面上,每张图片都有另一个尺寸,但在前面,每张图片看起来都相同。我怎么能意识到这样的事情?

这是我的代码:

*{
    margin: 0px;
    padding: 0px;
}

.button-submit{
    margin-top: 10px;
    padding: 10px 15px;
    border: 2px solid black;
    background-color: orange;
    color: black;
    transition: all 0.5s;
}

.button-submit:hover{
    color: orange;
    border: 2px solid orange;
    background-color: black;
}

.picture{
    width: 30%;
    height: 30%;
}
<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" href="meine.css" >
    </head>
    <body>
        <?php include "connection.php" ?>
        <h1>Lade dein Bild hoch</h1>
        
        <form action="upload.php" method="post" enctype="multipart/form-data">
            <input type="file" name="fileToUpload" id="fileToUpload">
            <br>
            <input type="submit" value="Upload Image" class="button-submit" name="submit">
        </form>
        <?php
            
            $sql = "SELECT * FROM bilder";
            $result=mysqli_query($db,$sql);
            while($row=mysqli_fetch_assoc($result)){
                echo "<img src='$row[bild_pfad]' alt='$row[bild_name]' style='$row[bild_werte]'>";
            } 
        ?>
    </body>
</html> 

这里是upload.php

<?php
include "connection.php";
//Ordner in dem die Datein geladen werden
$target_dir = "uploads/";
//Der Pfad (Order + / + Dateiname)
$target_file = $target_dir . basename($_FILES["fileToUpload"]["name"]);
//Variable ob der Upload fortfahren soll
$successful = TRUE;
//Von Pfad der Anbau (MyFile.Anbau(.jpg,.png,...)) wird in eine Variable geschrieben
$imageFileType = pathinfo($target_file,PATHINFO_EXTENSION);

$meldung = "";
//Wurde der Submit Button gedrückt?
if(isset($_POST["submit"])){
    //In dem Array werden verschiedene Werte gespeichert (Breite, Höhe, Typ), bei einem Fehler (falls kein Bild) ist der Rückgabewert False
    $check = getimagesize($_FILES["fileToUpload"]["tmp_name"]);
    if(!($check == false)){
        //Prüfe ob der Name bereits exestiert
        if(file_exists($target_file)){
            $meldung = "Der Bildname exestiert bereits.";
            $successful = FALSE;
        }
        //Prüfe die Größe des Bildes
        if($_FILES["fileToUpload"]["size"] > 500000){
            $meldung = $meldung . "<br>Das Bild ist zu groß.";
            $successful = FALSE;
        }
        //Prüfe Format des Bildes
        if($imageFileType != "jpg" && $imageFileType != "png" && $imageFileType != "jpeg" && $imageFileType != "JPG" && $imageFileType != "PNG" && $imageFileType != "JPEG") {
            $meldung = $meldung . "<br>Ungültiges Format.";
            $successful = FALSE;
        }
    }else{
        echo "Die Datei ist kein Bild.";
        $successful = FALSE;
    }
}

//Prüfe ob ein Fehler aufgetreten ist
if ($successful == FALSE){
    $meldung = $meldung . "<br>Die Datei wurde nicht hochgeladen.";
//Bei keinem Fehler
}else{
    if (move_uploaded_file($_FILES["fileToUpload"]["tmp_name"], $target_file)) {
        $picturename = $_FILES["fileToUpload"]["name"];
        $pictureheightwidth = $check[3];
        $picturepath = $target_file;
        
        $eintrag = "INSERT INTO bilder (bild_name, bild_werte, bild_pfad) VALUES ('$picturename', '$pictureheightwidth', '$picturepath')";
        $eintragen = mysqli_query($db, $eintrag);    
        
        $meldung = "Das Bild wurde erfolgreich hochgeladen";
    } else {
        $meldung = $meldung . "<br>Fehler beim hochladen des Bildes.";
    }
}


echo $meldung;
?> 

<a href="index.php">Zurück</a>

Link解决了我的问题。

1 个答案:

答案 0 :(得分:0)

每张照片大小不一的原因是因为你上课.picture {width:30%;身高:30%;  }

您已经提到了像素百分比,因此每个图像像素变化时图像大小都会变化。