قوالب css موفره للوقت

مدهش — Wed, 04 Jan 2012 21:38:02 +0000

هناك ما يسمى بقوالب اختصار الوقت كفكرة ليس بها أي اختلاف ولكن ما يميزها هو لمن يكثرون على نفس النمط كثير. هذا هيدر.. هذا فوتر.. هذا جانب.. وهكذا، هي جمع لبعض الأوامر التي تسهل عليك الكثير، ويمكن لأي شخص التعديل والإضافة عليها وحفظها، وانتظر التعليقات لمن يريد الإضافة عليها كورقة كاملة لتعم الفائدة إن شاء الله. قوالب توفير الوقت في CSS 1 – تعليقات الراس: كثير لا يكتبها ولكنها مفيدة على الأقل لمعرفه الحقوق لذلك سنبدأ بها.

: قوالب css موفره للوقت

[html] /*
Site Name:
Site URI:
Description:
Version:
Author:
Author URI:
*/
[/html]

2- الألوان الأساسية: فقط لتحديد نمط الألوان الأساسية في الموقع وليس تفصيلا.

[html] Body Background:
Main Text:
Links:
*/
[/html]

3- إعادة التصفير: لابدأن نأخذ في الاعتبار أن يكون بسيط وفي نفس الوقت يؤدي الغرض المطلوب منه وهو تصفير الخاص بـ ياهو.

[html] body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,
pre,form,fieldset,input,textarea,p,blockquote,th,td {
padding: 0;
margin: 0;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
ol,ul {
list-style: none;
}
h1,h2,h3,h4,h5,h6 {
font-weight: normal;
font-size: 100%;
}
abbr,acronym { border: 0;
}
[/html]

4- التنسيق الكامل للصفحة: يمكن الإضافة والحذف على حسب ما تريد، هذه مجرد الافتراضات الأساسية والشائعة التي يستخدمها الكثير من المصممين، ولا تنسَ أن تلائم الهتميل على هذه الافتراضات.

[html] body {
font-family: ;
font-size: 100%;
background: ;
color: #;
}
a:link {
color: #;
}
a:visited {
color: #;
}
a:hover, a:active {
color: #;
text-decoration: none;
}
h1 {
color: #;
font-size: ;
}
h2 {
color: #;
font-size: ;
}
h3 {
color: #;
font-size: ;
}
h4 {
color: #;
font-size: ;
}
ol {
list-style-type: ;
}
ul {
list-style-type: ;
}
li {
margin: ;
}
blockquote {}
#wrapper {
width: 960px;
margin: 10px auto;
}
[/html]

5 – الراس: للهيدر الخاص بالصفحة ]html[ #header {} #logo {} [/html] 6- الجزء الخاص بالملاحة كما يسمونه جزء القوائم:

[html] #nav {}
[/html]

7- المحتويات

[html] #content {}
#content h2 {}
#content h3 {}
#content p {}
[/html]

8- الجوانب

[html] #sidebar {}
#sidebar h2 {}
#sidebar ul {}
#sidebar li {}
[/html]

9- الحقول

[html] input {}
textarea {}
button {}
input:focus {}
textarea:focus {}
button:hover {}
[/html]

10- الجداول

[html] table {}
tr {}
th {}
td {}
[/html]

11- المؤخرة أو التذييل

[html] #footer {}
#footer h2 {}
#copyright {}
[/html]

12- وهناك بعض الإضافات الشائعة التي لا تندرج تحت بند معين من هذه البنود السابقة.

[html] .alignleft {float: left;}
.alignright {float: right;}
.clear {clear: both;}
.center {text-align: center;}
.left {text-align: left;}
.right {text-align: right;}
.small {font-size: 0.8em;}
.hidden {display: none;}
[/html]

فواصل » قوالب،css،موفره،للوقت،شروحات،لغات،تصميم

قوالب css موفره للوقت