Στυλ

Αυτή η σελίδα είναι εδώ για να αναδείξει στυλ για τυπικά στοιχεία σελίδας, όπως τυπογραφία, στοιχεία φόρμας και εικονίδια. Αυτά είναι κωδικοποιημένα σε ένα εναλλακτικό αρχείο προτύπου σελίδας, που ονομάζεται page.styles.liquid.


Typografia

Επικεφαλίδα

Επικεφαλίδα δύο

Τίτλος τρία

Κεφάλαιο XNUMX

Τίτλος πέντε
Κεφάλαιο έξι

Η1 ΤΟΜΕΑΣ

Η2 ΤΟΜΕΑΣ

Επικεφαλίδα H3

Επικεφαλίδα H4

Η5 ΤΟΜΕΑΣ
Επικεφαλίδα H6

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

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

  • ΝΕΕΣ ΑΦΙΞΕΙΣ
  • Πώληση & ειδικές προσφορές
  • ΓΥΝΑΙΚΕΙΑ
  • ΑΝΔΡΙΚΑ
  • Παπουτσια
  • Τσάντες & αξεσουάρ
  • Top Brands
  • Lookbook
  • Lorem ipsum dolor sit amet
  • Conse ctetur adipisicing elit sed do
  • Eiusmod χρονικό
  • Incididunt ut labore et dolore magna
  • Ενημερώστε και ελαχιστοποιήστε
  • Ύφασμα 1: 100% πολυεστέρας
  • Ύφασμα 2: 100% πολυεστέρας, επένδυση: 100% πολυεστέρας
  • Ύφασμα 3: 75% πολυεστέρας, 20% βισκόζη, 5% ελαστάνη
  1. Ύφασμα 1: 75% πολυεστέρας, 20% βισκόζη, 5% ελαστάνη
  2. Ύφασμα 2: 100% πολυεστέρας, επένδυση: 100% πολυεστέρας
  3. Ύφασμα 3: 100% πολυεστέρας

Επικεφαλίδες RTE

RTE επικεφαλίδα XNUMX

RTE επικεφαλίδα δύο

Τρίτη θέση RTE

RTE επικεφαλίδα τέσσερα

RTE επικεφαλίδα πέντε
RTE επικεφαλίδα έξι

Οι παράγραφοι

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exericationation ullamcorper.

Suscipit lobortis nisl ut aliquip ex ea mercho συνέπεια. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie συνέπεια.

Τύπος στυλ

Blockquotes

EU feugiat nulla Facilisis στο Vero Eros et Accsan και Iusto Odio Honissim Qui Blandit Present Luptatum Zzril Delenit Augue Duis Dolore Te Feugait Nulla Facisi. Nam liber tempor cum soluta nobis eleifend επιλογή congue nihil imperdiet doming id quod mazim placerat facer possim فرض.

Ο συγγραφέας του αποσπάσματος

Λίστες

ul (Προεπιλογή)
  • Ένας
  • Δύο
  • Τρία
  • Τέσσερα
Αριθμητική σφαίρα ol (Προεπιλογή)
  1. Ένας
  2. Δύο
  3. Τρία
  4. Τέσσερα
Παιδικές λίστες (για να ταιριάζουν με τα στυλ RTE)
  • Ένας
  • Δύο
  • Τρεις, με λίστα παιδιών
    • Πρώτο δευτερεύον στοιχείο
    • Δεύτερο δευτερεύον στοιχείο
    • Τρίτο υπο στοιχείο, με θυγατρική λίστα
      • Στοιχείο τρίτου επιπέδου
      • Ένα άλλο στοιχείο τρίτου επιπέδου
  • Τέσσερα

Αποκριτικοί πίνακες

ΠΑΡΑΓΓΕΛΙΑ ΗΜΕΡΟΜΗΝΙΑ ΚΑΤΑΣΤΑΣΗ ΠΛΗΡΩΜΗΣ ΠΛΗΡΗΣ ΚΑΤΑΣΤΑΣΗ ΣΥΝΟΛΟ
#1001 Δεκέμβριος 22, 2015 Εξουσιοδοτημένο Ανεκπλήρωτος $ 43.03
#1002 Δεκέμβριος 23, 2015 Εξουσιοδοτημένο Ανεκπλήρωτος $ 44.03
#1003 Δεκέμβριος 24, 2015 Εξουσιοδοτημένο Ανεκπλήρωτος $ 45.03
#1004 Δεκέμβριος 25, 2015 Εξουσιοδοτημένο Ανεκπλήρωτος $ 46.03
#1005 Δεκέμβριος 26, 2015 Εξουσιοδοτημένο Ανεκπλήρωτος $ 47.03
#1006 Δεκέμβριος 27, 2015 Εξουσιοδοτημένο Ανεκπλήρωτος $ 48.03

έντυπα

Προεπιλεγμένα στοιχεία φόρμας

Αόρατες ετικέτες

Προσθέστε μια κατηγορία label-hidden σε μια ετικέτα για να την κρύψει οπτικά, διατηρώντας παράλληλα την πρόσβαση σε αναγνώστες οθόνης. Χρησιμοποιήστε το placeholder χαρακτηριστικό ως ορατή ετικέτα σας.

Σημείωση: Η placeholder Το χαρακτηριστικό λειτουργεί μόνο στο IE10 +, επομένως οι αόρατες ετικέτες απενεργοποιούνται στον IE9 και κάτω.


Κάθετες φόρμες (πελάτης, επικοινωνία κ.λπ.)

Δεν υπάρχουν στυλ για αυτό στο Slate, αλλά χρησιμοποιούνται στα περισσότερα θέματα. Στοιχεία στυλ μέσα σε μια φόρμα / div με την κλάση `form-vertical` για να δείτε τα στυλ σας εδώ.

Δεν μπορείτε να προσθέσετε μια τάξη απευθείας στα περισσότερα στοιχεία υγρής μορφής (π.χ. {% form 'contact' %}). Αντ 'αυτού, τυλίξτε τη φόρμα σε div με την τάξη .form-vertical για να επιτύχετε το ίδιο αποτέλεσμα.

Τα πλαίσια ελέγχου

Ραδιόφωνα

Σφάλματα σημειώσεων και φόρμας

Δεν υπάρχουν στυλ σημειώσεων στο Slate αλλά συνήθως προστίθενται για τον χειρισμό σφαλμάτων φόρμας. Παραδείγματα στυλ:

 . σημείωση {padding: 20px; περίγραμμα: 1px στερεό #ccc; }. σημείωση - επιτυχία {border-color: green; χρώμα φόντου: ανοιχτό πράσινο }. σημείωση - σφάλμα {περίγραμμα-χρώμα: κόκκινο; χρώμα φόντου: ανοιχτόχρωμο; }
 

Παράδειγμα χρήσης:

 {% if form.posted_suses; %} Ευχαριστούμε που υποβάλατε τη φόρμα {% endif%} {% if form.errors%} {{form.errors | default_errors}} {% τέλος εαν %}
 
Αυτή είναι μια τυπική σημείωση
Αυτό είναι ένα μήνυμα επιτυχίας

Αυτό είναι ένα μήνυμα σφάλματος.

  • Οι κουκκίδες μπορούν να προσφέρουν περισσότερες πληροφορίες για το σφάλμα

κουμπιά

Προεπιλογή κουμπί

Προεπιλεγμένο κουμπί (χωρίς προεπιλογές)

Το κουμπί απενεργοποιήθηκε

Το προεπιλεγμένο κουμπί απενεργοποιήθηκε

Ευρύ κουμπί

Ευρύ προεπιλεγμένο κουμπί


Διάφορα στοιχεία

Οριζόντιοι κανόνες

Δεν υπάρχει προεπιλογή hr στυλ στο Slate, αλλά αυτά είναι κοινά για προσθήκη.

Αθέτηση hr


Αόρατος hr.hr--clear


Πρόκειται για μια τυπική ειδοποίηση cookie την οποία μπορείτε εύκολα να προσαρμόσετε ή να απενεργοποιήσετε όπως θέλετε στον διαχειριστή. Χρησιμοποιούμε cookies για να διασφαλίσουμε ότι σας προσφέρουμε την καλύτερη εμπειρία στον ιστότοπό μας.

Προ-φορτωτής
Αγγλικά
Αγγλικά