رفتن به مطلب
توقف فعالیت انجمن وردپرس پارسی، و ادامه فعالیت در انجمن رسمی وردپرس(کلیک کنید) ×
توقف فعالیت انجمن وردپرس پارسی، و ادامه فعالیت در انجمن رسمی وردپرس(کلیک کنید)

نحوه افزود کد HTML و CSS به قالب سایت

md3848

توسط md3848،
در برنامه نویسی استاتیک

دنبال‌کننده 0

پست های پیشنهاد شده

md3848

md3848 9

ارسال شده در
ارسال شده در (ویرایش شده)

سلام

والا من یه کد HTML و یه کد CSS دارم...که برا همدیگه هستن :)

کد HTML رو تو قابلم اضافه میکنم ولی نمیتونم CSS رو بهش ارتباط بدم

مثلا تگ هایul-li-p-H1 و.. رو اومده تو فایل CSS مقدار دهی کرده، ولی مشکل اینجاد که این تگ ها رو هم خود قابل سایت مقدار دهی کرده و این کد های HTML تگ های فایل CSS قالب رو به خودشون میگیرن و نه اون فایل CSS یی که من مد نظرم هستش.....

اینم از کد های CSS و HTML من.....ممنون میشم اساتید و دوستان راهنمایی کنن


<header>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<link rel="stylesheet" href="style_menu_top.css">
<div class="container">
	 <nav>
	 <ul>
		 <li><a href="index.html">منو<span>3</span></a></li>
		 <li><a href="index.html">نظرات<span>5400</span></a></li>
<li><a href="index.html">جفنگ ها<span>5400</span></a></li>
<li><a href="index.html">مطالب<span>5400</span></a></li>
	 </ul>
	 </nav>
</div>
</header>


.container{
width: 540px;
margin: 0 auto;
}
ul{
margin: 0;
list-style: none;
}
header {
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 2;
height: 37px;
line-height: 37px;
color: #ddd;
text-shadow: 0 -1px black;
background: #243942;
border-bottom: 1px solid #191919;
-webkit-box-shadow: inset 0 0 1px rgba(255, 255, 255, 0.1), 0 0 3px rgba(0, 0, 0, 0.8);
box-shadow: inset 0 0 1px rgba(255, 255, 255, 0.1), 0 0 3px rgba(0, 0, 0, 0.8);
}
nav {
float: right;
border-left: 1px solid #2f4b56;
border-left: 1px solid rgba(255, 255, 255, 0.05);
border-right: 1px solid #111;
}
li {
float: left;
}
a {
display: block;
padding: 0 15px;
color: #d0d9de;
text-decoration: none;
border-left: 1px solid #191919;
border-right: 1px solid #2f4b56;
border-right: 1px solid rgba(255, 255, 255, 0.05);
cursor: pointer;
}
a:hover {
background: #2f4b56;
background: rgba(255, 255, 255, 0.1);
}
li.active a, a:active {
padding-right: 16px;
background-color: #1b2b32;
border-right: 0;
-webkit-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.7);
box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.7);
}
span {
display: inline-block;
vertical-align: text-top;
margin-left: 10px;
padding: 0 5px;
line-height: 16px;
font-size: 11px;
color: white;
text-shadow: 0 1px #902a27;
background: #e93631;
border-radius: 2px;
-webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.2), 0 1px rgba(0, 0, 0, 0.2);
box-shadow: inset 0 1px rgba(255, 255, 255, 0.2), 0 1px rgba(0, 0, 0, 0.2);
}

ویرایش شده توسط md3848
لینک به ارسال
md3848

md3848 9

ارسال شده در
  • مالک
ارسال شده در

یعنی میگی مثل این مطلب کنم؟

p.black {color: black}

p.red {color:red}

http://neopersia.org/css/css_syntax.xhtml

این طوری باید به هر تک یه کلاس بدم که....

<p class="center">متن این پاراگراف به صورت وسط چین نمایش داده می شود</p>

<div class="center">متن این قسمت به صورت وسط چین نمایش داده می شود</div>

<h2 class="center">متن این سرفصل به صورت وسط چین نمایش داده می شود</h2>

لینک به ارسال
شهاب

شهاب 283

ارسال شده در
ارسال شده در

یعنی میگی مثل این مطلب کنم؟

p.black {color: black}

p.red {color:red}

http://neopersia.org...ss_syntax.xhtml

این طوری باید به هر تک یه کلاس بدم که....

<p class="center">متن این پاراگراف به صورت وسط چین نمایش داده می شود</p>

<div class="center">متن این قسمت به صورت وسط چین نمایش داده می شود</div>

<h2 class="center">متن این سرفصل به صورت وسط چین نمایش داده می شود</h2>

ببین خیلی ساده است تعریف کردن ای دی و کلاس

مثلا کد زیر یک نمونه ساده هست که نوشتم. در این کد آی دی شما که با # شروع میشه Mine و کلاس شما که با نقطه . شروع میشه text هست :


<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
#main{
    display:block;
    background-color:#069;
}
.text{
    color:#FFF;
}
</style>
</head>
<body>
<div id="main" class="text">
تست متن در آی دی mine و کلاس text
</div>
</body>
</html>

  • امتیاز 1
لینک به ارسال
اسماعیل ابراهیمی

اسماعیل ابراهیمی 371

ارسال شده در
ارسال شده در (ویرایش شده)

از important استفاده کن و تست بگیر

مثال :


p
{
font-family:tahoma !important;
}

ویرایش شده توسط Enter64
  • امتیاز 2
لینک به ارسال
md3848

md3848 9

ارسال شده در
  • مالک
ارسال شده در

دوستان کسی میتونه اون کد بالا رو ، مثلا یکی از تگ ها رو به شیوه صحیح بنویسه تا من متوجه بشم و با بقیه همین کارو بکنم

لینک به ارسال
شهاب

شهاب 283

ارسال شده در
ارسال شده در

از important استفاده کن و تست بگیر

مثال :


p
{
font-family:tahoma !important;
}

منظور شما این کد بود؟

مشخصه این که!!

کلاس ها رو با سی اس اس که مشخص کردی ، اگر کد بهشون اعمال نمیشه از Important استفاده کن در انتهای کد.

به این شکل 


.container{
font-family: yekan !important;
}

  • امتیاز 1
لینک به ارسال

لطفا برای ارسال دیدگاه وارد شوید

شما بعد از اینکه وارد حساب کاربری خود شدید می توانید دیدگاهی ارسال کنید



ورود به حساب کاربری
دنبال‌کننده 0
برو به فهرست موضوع ها
×
×
  • اضافه کردن...