Layouts

Ενσωματωμένα Layouts

Καθώς τα θέματα μπορούν να παρακάμψουν τη συμπεριφορά των layouts, ο καλύτερος τρόπος για να μάθετε ακριβώς τη χρήση, τις παραμέτρους και τα παραδείγματα είναι να ανατρέξετε στις οδηγίες χρήσης τους.

center

Εμφανίζει το περιεχόμενο στο κέντρο της οθόνης.

cover

Χρησιμοποιείται για την εμφάνιση του εξώφυλλου της παρουσίασης, το οποίο μπορεί να περιέχει τον τίτλο της παρουσίασης, τα συμφραζόμενα κλπ.

default

Το πιο βασικό layout, για την εμφάνιση οποιουδήποτε είδους περιεχομένου.

end

Η τελική σελίδα της παρουσίασης.

fact

Για να παρουσιάσετε κάποιο γεγονός ή δεδομένο με πολύ έμφαση στην οθόνη.

full

Χρησιμοποιήστε όλο το χώρο της οθόνης για την εμφάνιση του περιεχομένου.

image-left

Εμφανίζει μια εικόνα στην αριστερή πλευρά της οθόνης, το περιεχόμενο θα τοποθετηθεί στη δεξιά πλευρά.

Χρήση

---
layout: image-left

# η πηγή της εικόνας
image: /path/για/την/εικόνα

# ένα προσαρμοσμένο όνομα class για το περιεχόμενο
class: το-cool-περιεχόμενό-μου-στα-δεξιά
---

image-right

Εμφανίζει μια εικόνα στη δεξιά πλευρά της οθόνης, το περιεχόμενο θα τοποθετηθεί στην αριστερή πλευρά.

Χρήση

---
layout: image-right

# η πηγή της εικόνας
image: /path/για/την/εικόνα

# ένα προσαρμοσμένο όνομα class για το περιεχόμενο
class: το-cool-περιεχόμενό-μου-στα-αριστερά
---

image

Εμφανίζει μια εικόνα ως το κύριο περιεχόμενο της σελίδας.

Χρήση

---
layout: image

# η πηγή της εικόνας
image: /path/για/την/εικόνα
---

Μπορείτε να αλλάξετε το προεπιλεγμένο μέγεθος φόντου (cover) προσθέτοντας το χαρακτηριστικό backgroundSize:

---
layout: image
image: /path/για/την/εικόνα
backgroundSize: contain
---

---
layout: image-left
image: /path/για/την/εικόνα
backgroundSize: 20em 70%
---

iframe-left

Εμφανίζει μια ιστοσελίδα στην αριστερή πλευρά της οθόνης, το περιεχόμενο θα τοποθετηθεί στη δεξιά πλευρά.

Χρήση

---
layout: iframe-left

# the web page source
url: https://github.com/slidevjs/slidev

# ένα προσαρμοσμένο όνομα class για το περιεχόμενο
class: το-cool-περιεχόμενό-μου-στα-δεξιά
---

iframe-right

Εμφανίζει μια ιστοσελίδα στη δεξιά πλευρά της οθόνης, το περιεχόμενο θα τοποθετηθεί στην αριστερή πλευρά.

Χρήση

---
layout: iframe-right

# the web page source
url: https://github.com/slidevjs/slidev

# ένα προσαρμοσμένο όνομα class για το περιεχόμενο
class: το-cool-περιεχόμενό-μου-στα-αριστερά
---

iframe

Εμφανίζει μια ιστοσελίδα ως το κύριο περιεχόμενο της σελίδας.

Χρήση

---
layout: iframe

# the web page source
url: https://github.com/slidevjs/slidev
---

intro

Για την εισαγωγή της παρουσίασης, συνήθως με τον τίτλο της παρουσίασης, μια σύντομη περιγραφή, τον συγγραφέα κλπ.

none

Ένα layout χωρίς κανένα υπάρχον styling.

quote

Για να εμφανίσετε ένα απόσπασμα με έμφαση.

section

Χρησιμοποιείται για να σηματοδοτήσει την έναρξη μιας νέας ενότητας παρουσίασης.

statement

Κάντε μια διαβεβαίωση/δήλωση ως το κύριο περιεχόμενο της σελίδας.

two-cols

Διαχωρίζει το περιεχόμενο της σελίδας σε δύο στήλες.

Χρήση

---
layout: two-cols
---

# Αριστερά

Αυτό εμφανίζεται στα αριστερά

::right::

# Δεξιά

Αυτό εμφανίζεται στα δεξιά

two-cols-header

Διαχωρίζει την επάνω και την κάτω γραμμή του περιεχομένου της σελίδας και η δεύτερη γραμμή διαχωρίζει την αριστερή και τη δεξιά στήλη.

Χρήση

---
layout: two-cols-header
---

Αυτό καλύπτει και τα δύο

::left::

# Αριστερά

Αυτό εμφανίζεται στα αριστερά

::right::

# Δεξιά

Αυτό εμφανίζεται στα δεξιά

Προσαρμοσμένα Layouts

Δημιουργήστε ένα φάκελο layouts/ στη ρίζα του έργου σας, και απλά βάλτε τα προσαρμοσμένα Vue layout components σας σε αυτόν.

Διαβάστε περισσότερα στην ενότητα Προσαρμογές.

Layouts που παρέχονται από το θέμα

Τα θέματα μπορούν να παρέχουν layouts ή να παρακάμψουν τα υπάρχοντα. Παρακαλούμε διαβάστε τις οδηγίες χρήσης τους για ό,τι προσφέρουν.