Notice: wp_deregister_script was called <strong>incorrectly</strong>. اسکریپت‌ها و شیوه‌نامه‌ها نباید پیش از <code>wp_enqueue_scripts</code>، <code>admin_enqueue_scripts</code> و <code>login_enqueue_scripts</code> ثبت یا فراخوانی شوند. Please see <a href="http://codex.wordpress.org/Debugging_in_WordPress">Debugging in WordPress</a> for more information. (این پیام در نگارش 3.3 افزوده شده است.) in /home/ronakweb/domains/ronakweb.com/public_html/wp-includes/functions.php on line 3190





Warning: Cannot modify header information - headers already sent by (output started at /home/ronakweb/domains/ronakweb.com/public_html/wp-content/themes/ronakweb2/functions.php:289) in /home/ronakweb/domains/ronakweb.com/public_html/wp-includes/feed-rss2.php on line 8
<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>روناک وب &#124; طراحی سایت &#124; طراحی قالب وردپرس &#124; طراحی سایت وردپرس &#187; کشیدن مثلث با سی اس اس</title>
	<atom:link href="http://ronakweb.com/tag/%da%a9%d8%b4%db%8c%d8%af%d9%86-%d9%85%d8%ab%d9%84%d8%ab-%d8%a8%d8%a7-%d8%b3%db%8c-%d8%a7%d8%b3-%d8%a7%d8%b3/feed" rel="self" type="application/rss+xml" />
	<link>http://ronakweb.com</link>
	<description>طراحی سایت ، طراحی قالب وردپرس ، سئو و بهینه سازی سایت ، دانلود اسکریپت و فیلم آموزشی طراحی سایت و وردپرس از خدمات روناک وب می باشد</description>
	<lastBuildDate>Sat, 19 Aug 2023 09:51:14 +0000</lastBuildDate>
	<language>fa-IR</language>
		<sy:updatePeriod>hourly</sy:updatePeriod>
		<sy:updateFrequency>1</sy:updateFrequency>
	
	<item>
		<title>ایجاد مثلث با کد css در طراحی قالب وردپرس</title>
		<link>http://ronakweb.com/2181/%d8%a7%db%8c%d8%ac%d8%a7%d8%af-%d9%85%d8%ab%d9%84%d8%ab-%d8%a8%d8%a7-%da%a9%d8%af-css.html</link>
		<comments>http://ronakweb.com/2181/%d8%a7%db%8c%d8%ac%d8%a7%d8%af-%d9%85%d8%ab%d9%84%d8%ab-%d8%a8%d8%a7-%da%a9%d8%af-css.html#comments</comments>
		<pubDate>Thu, 05 May 2016 07:29:21 +0000</pubDate>
		<dc:creator><![CDATA[روناک وب]]></dc:creator>
				<category><![CDATA[طراحی سایت]]></category>
		<category><![CDATA[کدنویسی html و css]]></category>
		<category><![CDATA[طراحی قالب وردپرس]]></category>
		<category><![CDATA[کشیدن مثلث با سی اس اس]]></category>

		<guid isPermaLink="false">http://ronakweb.com/?p=2181</guid>
		<description><![CDATA[به احتمال زیاد در هنگام کدنویسی و طراحی قالب وردپرس با اشکال هندسی در طرح رابط کاربری یا همان psd قالب برخورد کرده اید، برای پیاده سازی اشکال هندسی چند راه وجود دارد که به اختصار هر کدام را شرح میدهیم. روش اول استفاده از فونت آیکون ها میباشد که اگر سایر ایکون و تصاویر [&#8230;]]]></description>
				<content:encoded><![CDATA[<p>به احتمال زیاد در هنگام کدنویسی و <a href="http://ronakweb.com" target="_blank">طراحی قالب وردپرس</a> با اشکال هندسی در طرح رابط کاربری یا همان psd قالب برخورد کرده اید، برای پیاده سازی اشکال هندسی چند راه وجود دارد که به اختصار هر کدام را شرح میدهیم. روش اول استفاده از فونت آیکون ها میباشد که اگر سایر ایکون و تصاویر پوسته در مجموعه فونت آیکون موجود هستند میتوانید از <a href="http://ronakweb.com/835/%d9%81%d9%88%d9%86%d8%aa-%d8%a2%db%8c%da%a9%d9%88%d9%86-%da%86%db%8c%d8%b3%d8%aa-%d8%af%d8%a7%d9%86%d9%84%d9%88%d8%af-%d8%a2%db%8c%da%a9%d9%88%d9%86-%d9%81%d9%88%d9%86%d8%aa-font-awesome.html" target="_blank">فونت آیکون</a> برای نمایش ایکونهای بخشهای مختلف رابط کاربری استفاده کنید. روش دوم بکارگیری div و اختصاص تصویر به عنوان تصویر زمینه div می باشد که میتوان با تعیین موقعیت position:absolute بخش را جابه جا کرد. اما بهترین روش ایجاد مثلث با کد css است زیرا توسط چند خط کد ساده امکان ساخت مثلث و سایر اشکال هندسی فراهم میشود درنتیجه سرعت بارگذاری پوسته افزایش می یابد. در این مطلب از روناک وب به آموزش و معرفی کدهای css و html لازم جهت ساخت مثلث های مکان نما راست، چپ، بالا و پایین می پردازیم پس تا انتها همراه ما باشید.</p>
<p><img class="aligncenter wp-image-2182 size-full" title="ایجاد مثلث با کد css در طراحی قالب وردپرس" src="http://ronakweb.com/wp-content/uploads/css-triangle-design-ronakweb.png" alt="ایجاد مثلث با کد css در طراحی قالب وردپرس" width="300" height="300" /></p>
<p><span id="more-2181"></span></p>
<h2>آموزش کشیدن و ایجاد مثلث با کد css و html</h2>
<p>همینطور که میدانید مثلث سه ضلعی و شبیه پیکان دارای نوک تیز میباشد توسط کدهای زیر و با اختصاص کلاس تعریف شده به div میتوانید مثلثهایی بسازید که نوک پیکان آن روبه بالا (کلاس arrow-up)، پایین (کلاس arrow-down)، راست (کلاس arrow-right) یا چپ (کلاس arrow-left) است.</p>
<pre class="brush: php; title: ; notranslate">
// html codes
&lt;div class=&quot;arrow-up&quot;&gt;&lt;/div&gt;
&lt;div class=&quot;arrow-down&quot;&gt;&lt;/div&gt;
&lt;div class=&quot;arrow-left&quot;&gt;&lt;/div&gt;
&lt;div class=&quot;arrow-right&quot;&gt;&lt;/div&gt;
// css codes
.arrow-up{
width: 0; height: 0; 
border-left: 5px solid transparent;border-right: 5px solid transparent;
border-bottom: 5px solid black;
}
.arrow-down{
width:0;height:0; 
border-left: 20px solid transparent;border-right: 20px solid transparent;
border-top: 20px solid #f00;
}
.arrow-right{
width: 0;height: 0; 
border-top: 60px solid transparent;border-bottom: 60px solid transparent;
border-left: 60px solid green;
}
.arrow-left{
width:0;height:0; 
border-top: 10px solid transparent;border-bottom: 10px solid transparent;
border-right:10px solid blue; 
}
</pre>
<p>برای تغییر رنگ مثلث باید کد رنگ اختصاص داده شده به border را تغییر دهید اگر میخواهید اندازه انرا نیز کنترل کنید میتوانید مقدار هر border را تغییر دهید.</p>
]]></content:encoded>
			<wfw:commentRss>http://ronakweb.com/2181/%d8%a7%db%8c%d8%ac%d8%a7%d8%af-%d9%85%d8%ab%d9%84%d8%ab-%d8%a8%d8%a7-%da%a9%d8%af-css.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>