המחלקה 'view-more'

שיעור 19 מתוך 31 בקורס כרטיס תלת־ממדי | פרויקט Front-end של Coddy.

אתגר

קל

יעד המחלקה ‘view-more’ בתוך ‘bottom’:

הגדר את התצוגה ל-Flex
הגדר את align-items ל-center.
הגדר את justify-content ל-flex-end.
הגדר את הרוחב ל-40%.

הוסף:

transition: all 0.2s ease-in-out;

הוסף גם אפקט ריחוף (חשוב):

.bottom .view-more:hover {
  transform: translate3d(0, 0, 10px);
}

נסו בעצמכם

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="styles.css">
</head>
    <body>
        <!-- כתבו כאן קוד HTML -->
        <script src="script.js"></script>
    </body>
</html>

כל השיעורים ביחידה כרטיס תלת־ממדי | פרויקט Front-end

תרגלו בעצמכם: Web אונליין