Πέμπτη, 17 Μαρτίου 2016

Το μαγικό πλήκτρο Ctrl! (Μέρος Δεύτερο)


Στο πρώτο μέρος: Το μαγικό πλήκτρο Ctrl! (Μέρος Πρώτο), ανακαλύψαμε τις δέκα πρώτες βασικές συντομεύσεις πληκτρολογίου, χρησιμοποιώντας το μαγικό πλήκτρο Ctrl! Παρακάτω, θα βρείτε ακόμα περισσότερες συντομεύσεις, γιατί όποιος ασχολείται με πληκτρολόγια και υπολογιστές, φτιάχνει εργασίες και σερφάρει στο Internet, οφείλει να τις γνωρίζει:

Πέμπτη, 14 Ιανουαρίου 2016

Το μαγικό πλήκτρο Ctrl! (Μέρος Πρώτο)


Κάθεστε όμορφα και ωραία μπροστά από τον υπολογιστή και το ποντίκι σας "πεθαίνει" από μπαταρία, ή έχετε το λάπτοπ σας και το στατικό του ποντίκι δεν σας βολεύει καθόλου…
Γιατί να χάνετε χρόνο όταν όλες τις εργασίες που κάνετε με το ποντίκι σας μπορείτε να τις κάνετε και με το πληκτρολόγιο σας;

Δείτε τις βασικές συντομεύσεις πληκτρολογίου με το πλήκτρο Ctrl:

Πέμπτη, 8 Οκτωβρίου 2015

Ένα «χέρι βοηθείας» από το πλήκτρο Shift !



Ρίχνοντας μια πιο προσεκτική ματιά, στο πληκτρολόγιο που βρίσκεται μπροστά σου,

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


Παρασκευή, 19 Οκτωβρίου 2012

Παρεμπόδιση των ρομπότ να βάλουν σε ευρετήριο μία web σελίδα

Σε περίπτωση που θέλουμε η σελίδα μας να έχει συγκεκριμένο κοινό, με τη χρήση του κωδικού <META> μπορούμε να εμποδίσουμε τα περισσότερα ρομπότ να βάλουν σε ευρετήριο τη σελίδα μας.

Χρησιμοποιούμε τις τιμές noindex για να εμποδίσουμε τα ρομπότ να βάλουν σε ευρετήριο τη σελίδα μας και nofollow για να εμποδίσουμε τα ρομπότ να βάλουν σε ευρετήριο οποιεσδήποτε σελίδες συνδεδεμένες με τη σελίδα μας.

Για παράδειγμα:

<META NAME="robots" CONTENT="noindex, nofollow">

Καθορισμός ημερομηνίας λήξης

Μπορούμε να καθορίσουμε μία ημερομηνία λήξης για τη σελίδα μας, για να ξέρουν οι χρήστες ότι βλέπουν  την τελευταία έκδοση της σελίδας.
Μεταξύ των κωδικών <HEAD> και </HEAD> πληκτρολογούμε:

<META HTTP-EQUIV="Expires" CONTENT="ημερομηνία λήξης της σελίδας μας">
Για παράδειγμα:

<META HTTP-EQUIV="Expires" CONTENT="Tues, 6 Jun 2012 12:46:45 GMT">

Καθορισμός πληροφοριών συντάκτη και πνευματικής ιδιοκτησίας

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

Για τον καθορισμό πληροφοριών συντάκτη, μεταξύ των κωδικών <HEAD> και </HEAD> πληκτρολογούμε:

<META NAME="author" CONTENT="Το όνομα του ατόμου που δημιούργησε τη σελίδα">

Για τον καθορισμό πληροφοριών πνευματικής ιδιοκτησίας, μεταξύ των κωδικών <HEAD> και </HEAD> πληκτρολογούμε:

<META NAME="copyright" CONTENT="Έτος του copyright και το όνομα του ατόμου ή της εταιρείας που έχει το copyright">

Για παράδειγμα:

<META NAME="author" CONTENT="Rosemary Baker">

<META NAME="copyright" CONTENT="2000 Grape Expectations">

Καθορισμός μίας συνοπτικής ιστοσελίδας

Μπορούμε να καθορίσουμε μία σύνοψη που θέλουμε να εμφανίζουν τα εργαλεία αναζήτησης όταν βρίσκουν τη σελίδα μας.

Πληκτρολογούμε ανάμεσα στο <HEAD> και </HEAD>:

<META NAME:"description" CONTENT="Μία σύνοψη της σελίδας μας">

Για παράδειγμα:

<META NAME:"description" CONTENT="information and details for construction sites">

Kαθορισμός λέξεων κλειδιών

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

Μεταξύ των κωδικών <HEAD> και </HEAD> πληκτρολογούμε:

<META NAME="keywords" CONTENT="μία λίστα από λέξεις κλειδιά που περιγράφουν την σελίδα μας">

Για παράδειγμα:

<META NAME="keywords" CONTENT="blb, webdesign , html, website">

Πέμπτη, 18 Οκτωβρίου 2012

Απόλυτη τοποθέτηση στοιχείων

Με την ιδιότητα position και τιμή absolute καθορίζουμε μία απόλυτη θέση για κάθε στοιχείο που χρησιμοποιεί ένα συγκεκριμένο κωδικό.

Χρησιμοποιούμε τις ιδότητες top, bottom, right, left.

Για παράδειγμα:

<STYLE>
IMG {position: absolute; bottom: 185px; left: 20px}
</STYLE>

Σχετική τοποθέτηση στοιχείων

Χρησιμοποιούμε την ιδιότητα position με την τιμή relative για να μετακινήσουμε κάθε στοιχείο από την αρχική του θέση, που χρησιμοποιεί ένα συγκεκριμένο αριθμό.

Επίσης χρησιμοποιούμε τις ιδιότητες: top, bottom, right, left για να μετακινήσουμε το στοιχείο από την αρχική του θέση.

Για παράδειγμα:

<STYLE>
IMG {position: relative; top: 70px; left: 220px}
</STYLE>

Προσθήκη αλλαγών σελίδων

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

Έχουμε τις ιδιότητες :

page-break-before με τιμή always για να συμβαίνει μία αλλαγή σελίδας πριν από κάθε στοιχείο που χρησιμοποιεί ένα συγκεκριμένο κωδικό.

page-break-after με τιμή always για να συμβαίνει μία αλλαγή σελίδας μετά από κάθε στοιχείο που χρησιμοποιεί ένα συγκεκριμένο κωδικό.

Χρησιμοποιούμε την τιμή avoid αντί για always για να εμποδίσουμε μία αλλαγή σελίδας πριν ή μετά από κάθε στοιχείο.

Για παράδειγμα:

<STYLE>
H1 {page-break-before: always}
</STYLE>

Κατακόρυφη στοίχιση στοιχείων

Με την ιδιότητα vertical-align καθορίζουμε κατακόρυφη στοίχιση σε όλα τα inline στοιχεία της σελίδας μας που χρησιμοποιούν ένα συγκεκριμένο κωδικό.

Χρησιμοποιούμε τις τιμές:

baseline για να στοιχίσουμε στοιχεία με τη γραμμή βάσης του κειμένου.
text-top για να στοιχίσουμε στοιχεία με την πάνω πλευρά του γύρω κειμένου.
text-bottom για να στοιχίσουμε στοιχεία με την κάτω πλευρά του κειμένου.
middle για να στοιχίσουμε στοιχεία με το μέσο των γύρω στοιχείων.
top για να στοιχίσουμε στοιχεία με το πάνω μέρος του υψηλότερου στοιχείου της τρέχουσας γραμμής.
bottom για να στοιχίσουμε στοιχεία με το κάτω μέρος του χαμηλότερου στοιχείου της τρέχουσας γραμμής.

Για παράδειγμα:

<STYLE>
IMG {vertical-align: baseline}
</STYLE>

Αλλαγή στυλ κουκκιδών ή αρίθμησης σε λίστες

Χρησιμοποιούμε την ιδιότητα life-style για να αλλάξουμε το στυλ των κουκκίδων των μη διατεταγμένων λιστών ( UL ) και των διατεταγμένων λιστών ( OL ).

Για τις μη διατεταγμένες λίστες χρησιμοποιούμε τις τιμές circle, disc, square.

Για τις διατεταγμένες λίστες χρησιμοποιούμε τις τιμές decimal ( 1, 2, 3 ), lower-alpha ( a, b, c ), upper-alpha ( A, B, C ), lower-roman ( i, ii, iii ), upper-roman ( I, II, III ).

Μπορούμε επίσης να χρησιμοποιήσουμε μία εικόνα σαν κουκκίδα χρησιμοποιώντας την τιμή url για να καθορίσουμε τη θέση και το όνομα της εικόνας στον υπολογιστή μας.

Για παράδειγμα:

<STYLE>
UL {list-style: square}
</STYLE>

Αλλαγή της εμφάνισης των στοιχείων

Με την ιδιότητα display μπορούμε να καθορίσουμε πώς θέλουμε να εμφανίζονται όλα τα στοιχεία της σελίδας μας που χρησιμοποιούν ένα συγκεκριμένο κωδικό.

Χρησιμοποιούμε τις τιμές :
block για να εμφανίσουμε τα στοιχεία σαν στοιχεία επιπέδου τμήματος
inline για να εμφανίσουμε ένα στοιχείο στην ίδια γραμμή με τα γύρω στοιχεία
list-item για να εμφανίσουμε στοιχεία σαν στοιχεία λίστας.

Για παράδειγμα:

<STYLE>
H2 {display: inline}
</STYLE>

Αναδίπλωση κειμένου γύρω από στοιχεία

Με την ιδιότητα float μπορούμε να αναδιπλώσουμε κείμενο γύρω από κάθε στοιχείο της σελίδας μας που χρησιμοποιεί ένα συγκεκριμένο κωδικό.

Χρησιμοποιούμε επίσης τις ιδιότητες left για να αναδιπλωθεί το κείμενο γύρω από τη δεξιά πλευρά κάθε στοιχείου και right για να αναδιπλωθεί το κείμενο γύρω από την αριστερή πλευρά κάθε στοιχείου.

Για παράδειγμα:

<STYLE>
IMG {float: left}
</STYLE>

Προσθήκη ενός περιγράμματος

Χρησιμοποιόυμε την ιδιότητα border για να βάλουμε ένα περίγραμμα γύρω από κάθε στοιχείο της σελίδας μας που χρησιμοποιεί ένα συγκεκριμένο κωδικό.

Μπορούμε να καθορίσουμε το πάχος του περιγράμματος περιγραφικά ( thin, medium, thick ) ή σε εικονοστοιχεία, χιλιοστά, εκατοστά κτλ. Επίσης καθορίζουμε ένα στυλ περιγράμματος όπως : solid ( συνεχόμενο ), double ( διπλό ), groove ( με αυλάκι ), ridge ( ανυψωμένο ), inset ( ένθετο ), outset ( εξωτερικό ), dotted ( με κουκκίδες ) και dashed ( διακεκομένο ).

Προσθέτωντας το όνομα ή την δεκαεξαδική τιμή του χρώματος καθορίζουμε ένα χρώμα για το περίγραμμά μας.

Για παράδειγμα:

<STYLE>
H2 {border: medium double #FF0000}
</STYLE>


Αλλαγή των περιθωρίων

Για να αλλάξουμε τα περιθώρια κάθε στοιχείου της σελίδας μας που χρησιμοποιεί ένα συγκεκριμένο κωδικό, χρησιμοποιούμε τις ιδιότητες margin-top, margin-bottom, margin-left και margin-right.

Καθορίζουμε ένα νέο μέγεθος περιθωρίου σαν ποσοστό του πλάτους ενός στοιχείου ή σε εικονοστοιχεία, σε χιλιοστά, εκατοστα κτλ.

Για παράδειγμα:

<STYLE>
P {margin-left:  60px}
</STYLE>

Προσθήκη κενού χώρου

Μπορούμε να προσθένα κενό χώρο γύρω από στοιχεία της σελίδας μας που χρησιμοποιούν ένα συγκεκριμένο κωδικό.

Χρησιμοποιούμε την ιδιότητα padding και καθορίζουμε τη ποσότητα του χώρου σε εικονοστοιχεία, εκατοστά, χιλιοστά κτλ.

Για παράδειγμα:

<STYLE>
P {padding: 60px}
</STYLE>

Ορισμός του πλάτους και του ύψους

Με τις ιδιότητες width και height μπορούμε να καθορίσουμε το πλάτος και το ύψος κάποιου στοιχείου της σελίδας μας που χρησιμοποιεί ένα συγκεκριμένο κωδικό.

Το πλάτος και το ύψος το καθορίζουμε σε εικονοστοιχεία, χιλιοστα, εκατοστα κτλ.

Για παράδειγμα:

<STYLE>
IMG {width: 180px; height:121px}
</STYLE>

Προσθήκη ενός χρώματος φόντου

Με την ιδιότητα {background: χρώμα της επιλογής μας} μπορούμε να προσθέσουμε ένα χρώμα φόντου σε κάθε στοιχείο της σελίδας μας που χρησιμοποιεί ένα συγκεκριμένο κωδικό.

Για παράδειγμα:

<STYLE>
H2{background: #FF0000}
</STYLE>