الكتابه ووضع الصور لصفحة html
3 مشترك
منتدى الدعم و المساعدة لأحلى المنتديات :: منتدى الدعم والمساعدة :: دعم مشاكل التومبلايت و الأكواد :: أرشيف قسم "مشاكل التومبلايت و الأكواد"
صفحة 1 من اصل 1
الكتابه ووضع الصور لصفحة html
السلام عليكم ورحمة الله وبركاته
..
أبدأ موضوعي بختصر المشكله عندي أو بالأصح هي مو مشكله أنا ابي منكم التوجيه الصحيح او الحل ..
الا وهي :
فتحت انا صفحة html وكنت ابي احط خلفيه وصوره بالأعلى مثل الهيدر بس ما ابي يكون بين اعلى الصفحه والهيدر مسافه
زي بالمنتدى يعني اذكر فيه اكواد تسوي هيدر للمنتدى بورقة css كود يشمل صورة الهيدر وصورة على اليمين واليسار مع صور الاطار مكرر
وصوره اسفل المندى من اليسار واليمين والوسط .. ! تتت444 وان كان بالأمكان ابي الكود ذا بعد ، اما صفحة الـ html
ابي احط لصفحه كود خلفيه للنص فقط بالوسط مثل خلفيات المواضيع بالمنتدى واسوي هيدر للصفحه
والخلفيه ذي بحيث أستطيع الكتابه عليها ووضع الصور بداخلها ..
جربت كم كود ولكن للأسف بعضها ظبط والبعض الأخر ما ظبط أو مو مثل الي ببالي مثل كود كخلفيه بس كان تكرار
وجانب الصفحه مو بالوسط ، وبحثت بمنتداكم كثير فـ قلت يمكن أنا ما بحثت زين
وبعد خلني أشوف أهل الخبره طولت بالموضوع بس صدق محتاجه ارجو1842
اتمنى تفيدوني بأسرع وقت ممكن و شاكره لكم .. ونا جيت لأهل الخبره لأني متأكده انكم بتفيدوني .
رد: الكتابه ووضع الصور لصفحة html
omarpop23 كتب:طيب ممكن تحط الاكواد HTML المستخدمة لتظبيطها بال CSS
احط الأكواد لك هنا ؟ وتعدلها ولا كيف تقصد ..
رد: الكتابه ووضع الصور لصفحة html
ما حطيت اكواد حطيت صور لان ما عرفت اظبط كود خلفيه بس بحط الاكواد الي معي
كود خلفيه :
هذا كود خلفية مواضيع بس زمان كان يصلح لصفحات الـ html لكن الحين ما يظبط مادري ليه ~
انا ابي كود خلفيه زي الكود الي فوق حق خلفيات المواضيع لكن لصفحة الـ html
ويكون بالنص وتكرار ويكون فيه عرض للخلفيه محدد برقم
بحيث يكون خلفيه للكتابه او الصور مثل المواضيع ان شاءالله شرحي واضح *^*
كود خلفيه :
- الكود:
<body background="هنا رابط صورة الخلفية">
هذا كود خلفية مواضيع بس زمان كان يصلح لصفحات الـ html لكن الحين ما يظبط مادري ليه ~
- الكود:
[table style="width: 700px; height: 700px;" align="center" background="الخلفية هنا" border="0" bordercolor="#4880af" cellpadding="0" cellspacing="0"][tr][td valign="top"][center]
[color=black][img]المقدمممة[/img][/color]
[/center]
[/td][/tr][/table]
انا ابي كود خلفيه زي الكود الي فوق حق خلفيات المواضيع لكن لصفحة الـ html
ويكون بالنص وتكرار ويكون فيه عرض للخلفيه محدد برقم
بحيث يكون خلفيه للكتابه او الصور مثل المواضيع ان شاءالله شرحي واضح *^*
رد: الكتابه ووضع الصور لصفحة html
صورة توضيحية للتصميم
- الكود:
<html dir="rtl" lang="ar">
<head>
<meta charset="utf-8" />
<title>Page Title</title> <!-- ادخل هنا اسم الصفحة -->
<style type="text/css">
body {
margin: 0;
paddinh: 0;
box-sizing: border-box;
background-color: #2e3133;
}
a {
text-decoration: none;
}
.omar-page-header img, .omar-page-header span {
display:inline-block;
vertical-align: middle;
color: #333;
}
.omar-page-header img {
padding: 15px;
}
.omar-page-header, .page-content {
background: #fff;
}
#tabs {
height:45px;
padding-left:40px;
background-color:#369fcf;
}
#tabs ul {
margin:0;
list-style:none;
}
#tabs ul {
margin:0 15px;
}
#tabs li {
display:inline-block;
height:45px;
font-weight:bold;
height:45px;
float:right;
}
#tabs a {
text-decoration:none;
color:#FFFFFF;
height:45px;
display:inline-block;
}
#tabs a span {
box-sizing:border-box;
display:block;
font-family:"Helvetica";
height:45px;
line-height:45px;
padding:0 30px;
transition-duration:300ms;
}
#tabs a:hover span,#tabs #activetab a span {
background-color: rgba( 255,255,255,0.2 );
}
.page-content {
background: #fafafa;
border: 1px solid #ccc;
width: 90%;
margin: 0 auto;
padding: 15px;
text-align: center;
}
.page-content h1 {
margin-top: 0;
}
.content-block {
background: #fff;
padding: 10px;
width: 90%;
min-height: 500px;
border: 1px solid #39c;
border-radius: 5px;
display:inline-block;
}
#page-footer {
background-color: #2e3133;
box-sizing: border-box;
clear: both;
color: #a3aaae;
font-size: 1em;
height: auto;
padding: 20px;
text-align: center;
}
</style>
</head>
<body class="omarpop23">
<div class="omar-page-header">
<a href="رابط المنتدى">
<img src="https://2img.net/r/frmste/images/sigle.png" />
<span>اسم الموقع</span>
</a>
</div>
<div id="tabs">
<ul>
<li><a id="short-link" href="/#"><span>رابط نصي</span></a></li>
<li><a id="short-link" href="/#"><span>رابط نصي</span></a></li>
<li><a id="short-link" href="/#"><span>رابط نصي</span></a></li>
<li><a id="short-link" href="/#"><span>رابط نصي</span></a></li>
</ul>
</div>
<div style="background: #fff; padding-bottom: 50px;">
<div class="page-content">
<h1 class="content-title">عنوان الموضوع</h1>
<div class="content-block">
المقدددمممة
</div>
</div>
</div>
<div id="page-footer">
<a class="help-link" href="/#" target="_blank">
<img src="https://2img.net/r/frmste/images/free-hosting-forum.png" alt="" />
</a>
</div>
</body>
</html>
رد: الكتابه ووضع الصور لصفحة html
omarpop23 كتب:اسف ع التأخير في كتابة صفحة HTML اعذرني إن كان بها أخطاء فقد قمت بكتابة اﻷكواد من خلال الهاتف
صورة توضيحية للتصميم
- الكود:
<html dir="rtl" lang="ar">
<head>
<meta charset="utf-8" />
<title>Page Title</title> <!-- ادخل هنا اسم الصفحة -->
<style type="text/css">
body {
margin: 0;
paddinh: 0;
box-sizing: border-box;
background-color: #2e3133;
}
a {
text-decoration: none;
}
.omar-page-header img, .omar-page-header span {
display:inline-block;
vertical-align: middle;
color: #333;
}
.omar-page-header img {
padding: 15px;
}
.omar-page-header, .page-content {
background: #fff;
}
#tabs {
height:45px;
padding-left:40px;
background-color:#369fcf;
}
#tabs ul {
margin:0;
list-style:none;
}
#tabs ul {
margin:0 15px;
}
#tabs li {
display:inline-block;
height:45px;
font-weight:bold;
height:45px;
float:right;
}
#tabs a {
text-decoration:none;
color:#FFFFFF;
height:45px;
display:inline-block;
}
#tabs a span {
box-sizing:border-box;
display:block;
font-family:"Helvetica";
height:45px;
line-height:45px;
padding:0 30px;
transition-duration:300ms;
}
#tabs a:hover span,#tabs #activetab a span {
background-color: rgba( 255,255,255,0.2 );
}
.page-content {
background: #fafafa;
border: 1px solid #ccc;
width: 90%;
margin: 0 auto;
padding: 15px;
text-align: center;
}
.page-content h1 {
margin-top: 0;
}
.content-block {
background: #fff;
padding: 10px;
width: 90%;
min-height: 500px;
border: 1px solid #39c;
border-radius: 5px;
display:inline-block;
}
#page-footer {
background-color: #2e3133;
box-sizing: border-box;
clear: both;
color: #a3aaae;
font-size: 1em;
height: auto;
padding: 20px;
text-align: center;
}
</style>
</head>
<body class="omarpop23">
<div class="omar-page-header">
<a href="رابط المنتدى">
<img src="https://2img.net/r/frmste/images/sigle.png" />
<span>اسم الموقع</span>
</a>
</div>
<div id="tabs">
<ul>
<li><a id="short-link" href="/#"><span>رابط نصي</span></a></li>
<li><a id="short-link" href="/#"><span>رابط نصي</span></a></li>
<li><a id="short-link" href="/#"><span>رابط نصي</span></a></li>
<li><a id="short-link" href="/#"><span>رابط نصي</span></a></li>
</ul>
</div>
<div style="background: #fff; padding-bottom: 50px;">
<div class="page-content">
<h1 class="content-title">عنوان الموضوع</h1>
<div class="content-block">
المقدددمممة
</div>
</div>
</div>
<div id="page-footer">
<a class="help-link" href="/#" target="_blank">
<img src="https://2img.net/r/frmste/images/free-hosting-forum.png" alt="" />
</a>
</div>
</body>
</html>
الكود رائع جداً ، لكن كيف اضيف صوره بالمقدمه
وكيف احط خلفيه للصفحه تكون صوره ليس لون .؟
رد: الكتابه ووضع الصور لصفحة html
تم التعديل علي الاكواد و تبسيطها لسهولة تغير الخلفيات كما يحلو لك
اذا كنت تريد وضع صورة بدل اللون يمكنك تغيرة عن طريق استبدال كود اللون بكود الصورة مثااااال
كود اللون:
#fff
كود الصورة:
url(رابط الصورة)
- الكود:
<html dir="rtl" lang="ar">
<head>
<meta charset="utf-8" />
<title>Page Title</title> <!-- ادخل هنا اسم الصفحة -->
<style type="text/css">
/* خلفية اعلى الصفحة */
.omar-page-header {
background: #fff;
}
/* خلفية الروابط */
#tabs {
background: #369fcf;
}
/* خلفية الصفحة */
.page-background {
background: #fff;
}
/* خلفية محتوى الصفحة */
.page-content {
background: #fafafa;
}
/* خلفية الموضوع */
.content-block {
background: #fff;
}
/* خلفية اسفل الصفحة */
#page-footer {
background: #2e3133;
}
body {
margin: 0;
paddinh: 0;
box-sizing: border-box;
background-color: #2e3133;
}
a {
text-decoration: none;
}
.omar-page-header img, .omar-page-header span {
display:inline-block;
vertical-align: middle;
color: #333;
}
.omar-page-header img {
padding: 15px;
}
#tabs {
height:45px;
padding-left:40px;
}
#tabs ul {
margin:0;
list-style:none;
}
#tabs ul {
margin:0 15px;
}
#tabs li {
display:inline-block;
height:45px;
font-weight:bold;
height:45px;
float:right;
}
#tabs a {
text-decoration:none;
color:#FFFFFF;
height:45px;
display:inline-block;
}
#tabs a span {
box-sizing:border-box;
display:block;
font-family:"Helvetica";
height:45px;
line-height:45px;
padding:0 30px;
transition-duration:300ms;
}
#tabs a:hover span,#tabs #activetab a span {
background-color: rgba( 255,255,255,0.2 );
}
.page-content {
border: 1px solid #ccc;
width: 90%;
padding: 15px;
margin: 0 auto;
text-align: center;
}
.page-content h1 {
margin-top: 0;
}
.content-block {
padding: 10px;
width: 90%;
min-height: 500px;
border: 1px solid #39c;
border-radius: 5px;
display:inline-block;
}
#page-footer {
box-sizing: border-box;
clear: both;
color: #a3aaae;
font-size: 1em;
height: auto;
padding: 20px;
text-align: center;
}
</style>
</head>
<body class="omarpop23">
<div class="omar-page-header">
<a href="رابط المنتدى">
<img src="https://2img.net/r/frmste/images/sigle.png" />
<span>اسم الموقع</span>
</a>
</div>
<div id="tabs">
<ul>
<li><a id="short-link" href="/#"><span>رابط نصي</span></a></li>
<li><a id="short-link" href="/#"><span>رابط نصي</span></a></li>
<li><a id="short-link" href="/#"><span>رابط نصي</span></a></li>
<li><a id="short-link" href="/#"><span>رابط نصي</span></a></li>
</ul>
</div>
<div class="page-background" style="padding-bottom: 50px">
<div class="page-content">
<h1 class="content-title">عنوان الموضوع</h1>
<div class="content-block">
المقدددمممة
</div>
</div>
</div>
<div id="page-footer">
<a class="help-link" href="/#" target="_blank">
<img src="https://2img.net/r/frmste/images/free-hosting-forum.png" alt="" />
</a>
</div>
</body>
</html>
اذا كنت تريد وضع صورة بدل اللون يمكنك تغيرة عن طريق استبدال كود اللون بكود الصورة مثااااال
كود اللون:
#fff
كود الصورة:
url(رابط الصورة)
رد: الكتابه ووضع الصور لصفحة html
مر على الموضوع اسبوع تقريباً , هذه يعني ان الموضوع تم حلة او أهملت من صاحب المشكلة رجاء في حال كانت لديك المشكلة مستمر او اي استفسار اخر قم بفتح موضوع جديد سيتم غلق الموضوع & يرسل الى الأرشيف
|
مواضيع مماثلة
» هل هناك كود لجعل صفحة html تقبل العربية؟
» كيف اقوم بحزف مشاركات عضو مرة واحده؟
» مشكلة عدم ظهور الصور في صفحة html
» مساعدة في حذف ركن كاتب الموضووع
» ظهور المنتدى على شكل صفحة فارغة
» كيف اقوم بحزف مشاركات عضو مرة واحده؟
» مشكلة عدم ظهور الصور في صفحة html
» مساعدة في حذف ركن كاتب الموضووع
» ظهور المنتدى على شكل صفحة فارغة
منتدى الدعم و المساعدة لأحلى المنتديات :: منتدى الدعم والمساعدة :: دعم مشاكل التومبلايت و الأكواد :: أرشيف قسم "مشاكل التومبلايت و الأكواد"
صفحة 1 من اصل 1
صلاحيات هذا المنتدى:
لاتستطيع الرد على المواضيع في هذا المنتدى