آیا می خواهید یک صفحه وب اساسی ایجاد کنید؟ این نمونه های HTML را یاد بگیرید و آنها را در یک ویرایشگر متن امتحان کنید تا ببینید در مرورگر شما چگونه به نظر می رسند.
حتی اگر وب‌سایت‌های مدرن معمولاً با رابط‌های کاربرپسند ساخته می‌شوند، دانستن برخی از HTML اولیه مفید است. اگر 17 تگ نمونه HTML زیر (و چند مورد اضافی) را می‌شناسید، می‌توانید یک صفحه وب اولیه را از ابتدا ایجاد کنید یا کد ایجاد شده توسط برنامه‌ای مانند وردپرس را تغییر دهید.
ما نمونه های ساده کد HTML را با خروجی بیشتر تگ ها ارائه کرده ایم. اگر می خواهید آنها را برای خودتان آزمایش کنید، نمونه کد HTML را در سند خود کپی کنید. می توانید با آنها در یک ویرایشگر متن بازی کنید و فایل خود را در مرورگر بارگذاری کنید تا ببینید تغییرات شما چه کار می کنند. بیا شروع کنیم!
1.
شما در ابتدای هر سند HTML که ایجاد می کنید به این تگ نیاز دارید. این تضمین می کند که مرورگر وب می داند که در حال خواندن HTML است و انتظار دارد HTML5، آخرین نسخه باشد. اگرچه این در واقع یک تگ HTML نیست، اما دانستن آن هنوز هم مهم است.
2.
این تگ دیگری است که به مرورگر می گوید که در حال خواندن HTML است. تگ مستقیماً بعد از تگ DOCTYPE قرار می گیرد و شما آن را با یک تگ درست در انتهای فایل خود می بندید. هر چیز دیگری در سند شما بین این برچسب ها قرار می گیرد.
3. <سر>
تگ
بخش هدر فایل شما را شروع می کند. مواردی که در اینجا وارد می شوند در صفحه وب شما ظاهر نمی شوند. در عوض، حاوی ابرداده برای موتورهای جستجو و اطلاعات برای مرورگر شما است. اگر می‌خواهید در سایت خود تبلیغات داشته باشید، کد AdSense Google نیز در اینجا قرار می‌گیرد.
برای صفحات اصلی، تگ
حاوی عنوان شما خواهد بود و همین. اما چند مورد دیگر وجود دارد که می توانید آنها را بگنجانید که ما در یک لحظه به آنها خواهیم پرداخت.
4. </h2>
<p><img class='aligncenter' alt='تگ عنوان html' src='https://static1.makeuseofimages.com/wordpress/wp-content/uploads/2021/06/title-tag.png' width='700'></p>
<p style='text-align: justify;'>این تگ عنوان صفحه شما را تعیین می کند. تنها کاری که باید انجام دهید این است که عنوان خود را در تگ قرار دهید و آن را مانند این ببندید (برای نشان دادن زمینه، تگ های سرصفحه را نیز اضافه کرده ایم):</p>
<pre><p dir='ltr' style='text-align: left;'><code class="hljs html"><span class="hljs-tag"><<span class="hljs-name">head</span>></span><br/><span class="hljs-tag"><<span class="hljs-name">title</span>></span>My Website<span class="hljs-tag"></<span class="hljs-name">title</span>></span><br/><span class="hljs-tag"></<span class="hljs-name">head</span>></span></code></p></pre>
<p style='text-align: justify;'>این نامی است که وقتی در مرورگر باز می شود به عنوان عنوان برگه نمایش داده می شود.</p>
<h2>5. <meta></h2>
<p style='text-align: justify;'>مانند تگ عنوان، ابرداده در قسمت هدر صفحه شما قرار می گیرد. ابرداده در درجه اول توسط موتورهای جستجو استفاده می شود و اطلاعاتی در مورد آنچه در صفحه شما وجود دارد است. چندین متا فیلد وجود دارد، اما اینها برخی از رایج ترین آنها هستند:</p>
<ul>
<li>توضیحات: توضیحات اولیه از صفحه شما.</li>
<li>کلمات کلیدی: مجموعه ای از کلمات کلیدی قابل استفاده برای صفحه شما (اگرچه در حال حاضر موتورهای جستجو معمولاً آنها را نادیده می گیرند).</li>
<li>نویسنده: نویسنده صفحه شما.</li>
<li>viewport: برچسبی برای اطمینان از اینکه صفحه شما در همه دستگاه ها خوب به نظر می رسد.</li>
</ul>
<p style='text-align: justify;'>در اینجا یک مثال است که ممکن است برای این صفحه اعمال شود:</p>
<pre><p dir='ltr' style='text-align: left;'><code class="hljs html"><span class="hljs-tag"><<span class="hljs-name">meta</span> <span class="hljs-attr">name</span>=<span class="hljs-string">"description"</span> <span class="hljs-attr">content</span>=<span class="hljs-string">"A basic HTML tutorial"</span>></span><br/><span class="hljs-tag"><<span class="hljs-name">meta</span> <span class="hljs-attr">name</span>=<span class="hljs-string">"keywords"</span> <span class="hljs-attr">content</span>=<span class="hljs-string">"HTML,code,tags"</span>></span><br/><span class="hljs-tag"><<span class="hljs-name">meta</span> <span class="hljs-attr">name</span>=<span class="hljs-string">"author"</span> <span class="hljs-attr">content</span>=<span class="hljs-string">"MUO"</span>></span><br/><span class="hljs-tag"><<span class="hljs-name">meta</span> <span class="hljs-attr">name</span>=<span class="hljs-string">"viewport"</span> <span class="hljs-attr">content</span>=<span class="hljs-string">"width=device-width, initial-scale=1.0"</span>></span></code></p></pre>
<p style='text-align: justify;'>برچسب “viewport” همیشه باید دارای “width=device-width, first-scale=1.0” به عنوان محتوا باشد تا مطمئن شوید صفحه شما به خوبی در دستگاه های تلفن همراه و دسکتاپ نمایش داده می شود.</p>
<h2>6. <body></h2>
<p style='text-align: justify;'>پس از بستن قسمت هدر، به بدنه می رسید. این را با تگ <body> باز می کنید و با تگ </body> می بندید. درست در انتهای فایل شما، درست قبل از تگ </html> قرار می گیرد.</p>
<p style='text-align: justify;'>تمام محتوای صفحه وب شما بین این تگ های بدنه قرار می گیرد. به همان اندازه که به نظر می رسد ساده است:</p>
<pre><p dir='ltr' style='text-align: left;'><code class="hljs html"><span class="hljs-tag"><<span class="hljs-name">body</span>></span><br/>Everything you want displayed on your page.<br/><span class="hljs-tag"></<span class="hljs-name">body</span>></span></code></p></pre>
<h2>7. </p>
<h1> (و سایر برچسب‌های سرصفحه)</h2>
<p style='text-align: justify;'>تگ </p>
<h1> یک هدر سطح یک در صفحه شما تعریف می کند. این معمولا عنوان خواهد بود و در حالت ایده آل فقط یک عنوان در هر صفحه وجود خواهد داشت.</p>
<p style='text-align: justify;'>
<h2> سرصفحه های سطح دو مانند سرصفحه های بخش، </p>
<h3> سطح سوم زیر سرصفحه ها و غیره را تا </p>
<h6> تعریف می کند. به عنوان مثال، نام تگ ها در این مقاله هدر سطح دو هستند.</p>
<pre><p dir='ltr' style='text-align: left;'><code class="hljs html"><span class="hljs-tag"><<span class="hljs-name">h1</span>></span>Big and Important Header<span class="hljs-tag"></<span class="hljs-name">h1</span>></span><br/><span class="hljs-tag"><<span class="hljs-name">h2</span>></span>Slightly Less Big Header<span class="hljs-tag"></<span class="hljs-name">h2</span>></span><br/><span class="hljs-tag"><<span class="hljs-name">h3</span>></span>Sub-Header<span class="hljs-tag"></<span class="hljs-name">h3</span>></span></code></p></pre>
<p style='text-align: justify;'>نتیجه:</p>
<p><img class='aligncenter' alt='تگ های هدر html' src='https://static1.makeuseofimages.com/wordpress/wp-content/uploads/2021/06/header-tags.jpg' width='700'></p>
<p style='text-align: justify;'>همانطور که می بینید، آنها در هر سطح کوچکتر می شوند. موتورهای جستجو آنها را به ترتیب اهمیت رتبه بندی می کنند.</p>
<h2>8. </p>
</h2>
<p style='text-align: justify;'>تگ پاراگراف یک پاراگراف جدید را شروع می کند. این معمولاً دو شکست خط را وارد می کند.</p>
<p style='text-align: justify;'>به عنوان مثال، به فاصله بین خط قبلی و این یکی نگاه کنید. این کاری است که یک تگ </p>
<p> انجام خواهد داد.</p>
<pre><p dir='ltr' style='text-align: left;'><code class="hljs html"><span class="hljs-tag"><<span class="hljs-name">p</span>></span>Your first paragraph.<span class="hljs-tag"></<span class="hljs-name">p</span>></span><br/><span class="hljs-tag"><<span class="hljs-name">p</span>></span>Your second paragraph.<span class="hljs-tag"></<span class="hljs-name">p</span>></span></code></p></pre>
<p style='text-align: justify;'>نتیجه:</p>
<p style='text-align: justify;'>اولین پاراگراف شما</p>
<p style='text-align: justify;'>پاراگراف دوم شما</p>
<p style='text-align: justify;'>همچنین می توانید از سبک های CSS در تگ های پاراگراف خود استفاده کنید، مانند این که اندازه متن را تغییر می دهد:</p>
<pre><p dir='ltr' style='text-align: left;'><code class="hljs html"><span class="hljs-tag"><<span class="hljs-name">p</span> <span class="hljs-attr">style</span>=<span class="hljs-string">"font-size: 150%;"</span>></span>This is 50% larger text.<span class="hljs-tag"></<span class="hljs-name">p</span>></span></code></p></pre>
<p style='text-align: justify;'>نتیجه:</p>
<p><img class='aligncenter' alt='بزرگتر کردن متن در html' src='https://static1.makeuseofimages.com/wordpress/wp-content/uploads/2021/06/p-tag.jpg' width='700'></p>
<h2>9. <br /></h2>
<p style='text-align: justify;'>تگ شکست خط یک شکست خط را وارد می کند، بدون فاصله بین خطوط:</p>
<pre><p dir='ltr' style='text-align: left;'><code class="hljs html"><span class="hljs-tag"><<span class="hljs-name">p</span>></span>The first line.<br/><br/>The second line (close to the first one).<span class="hljs-tag"></<span class="hljs-name">p</span>></span></code></p></pre>
<p style='text-align: justify;'>نتیجه:</p>
<p><img class='aligncenter' alt='شکست خط در html' src='https://static1.makeuseofimages.com/wordpress/wp-content/uploads/2021/06/br-tag.jpg' width='700'></p>
<p style='text-align: justify;'>کار به روشی مشابه تگ </p>
<hr>
<p> است. این یک خط افقی روی صفحه شما می کشد و برای جدا کردن بخش های متن خوب است.</p>
<h2>10. <strong></h2>
<p style='text-align: justify;'>این تگ متن مهم را تعریف می کند. به طور کلی، این بدان معناست که پررنگ خواهد بود، اگرچه می توان از CSS برای نمایش متن <strong> متفاوت استفاده کرد.</p>
<p style='text-align: justify;'>با این حال، به طور پیش فرض، می توانید با خیال راحت از <strong> برای متن پررنگ استفاده کنید.</p>
<pre><p dir='ltr' style='text-align: left;'><code class="hljs html"><span class="hljs-tag"><<span class="hljs-name">strong</span>></span>Very important things you want to say.<span class="hljs-tag"></<span class="hljs-name">strong</span>></span></code></p></pre>
<p style='text-align: justify;'>نتیجه:</p>
<p style='text-align: justify;'>چیزهای بسیار مهمی که می خواهید بگویید.</p>
<p style='text-align: justify;'>اگر با برچسب <b> برای متن پررنگ آشنا هستید، همچنان کار می کند، اما دیگر توصیه نمی شود. همیشه باید به جای آن از تگ <strong> استفاده کنید.</p>
<h2>11. <em></h2>
<p style='text-align: justify;'>مانند <b> و <strong>، <em> و <i> مرتبط هستند. تگ <em> متن تاکید شده را مشخص می کند، که به طور کلی به این معنی است که به صورت مورب در می آید. باز هم، این احتمال وجود دارد که CSS نمایش متن تاکید شده را متفاوت کند.</p>
<pre><p dir='ltr' style='text-align: left;'><code class="hljs html"><span class="hljs-tag"><<span class="hljs-name">em</span>></span>An emphasized line.<span class="hljs-tag"></<span class="hljs-name">em</span>></span></code></p></pre>
<p style='text-align: justify;'>نتیجه:</p>
<p style='text-align: justify;'>یک خط تاکید شده</p>
<p style='text-align: justify;'>تگ <i> همچنان کار می کند، اما باز هم توصیه نمی شود و ممکن است در نسخه های بعدی HTML منسوخ شود.</p>
<h2>12. <a></h2>
<p style='text-align: justify;'>تگ <a> یا لنگر به شما امکان می دهد پیوند ایجاد کنید. یک لینک ساده شبیه این است:</p>
<pre><p dir='ltr' style='text-align: left;'><code class="hljs html"><span class="hljs-tag"><<span class="hljs-name">a</span> <span class="hljs-attr">href</span>=<span class="hljs-string">"https://www.muo.com/>Go to MUO</a></span></span></code></p></pre>
<p style='text-align: justify;'>نتیجه:</p>
<p style='text-align: justify;'>به MUO بروید</p>
<p style='text-align: justify;'>ویژگی “href” مقصد پیوند را مشخص می کند. در بیشتر موارد، این یک وب سایت دیگر خواهد بود. همچنین می تواند یک فایل باشد، مانند یک تصویر یا یک PDF.</p>
<p style='text-align: justify;'>سایر ویژگی های مفید عبارتند از “هدف” و “عنوان”. ویژگی target تقریباً به طور انحصاری برای باز کردن پیوند در یک تب یا پنجره جدید استفاده می شود، مانند این:</p>
<pre><p dir='ltr' style='text-align: left;'><code class="hljs html"><span class="hljs-tag"><<span class="hljs-name">a</span> <span class="hljs-attr">href</span>=<span class="hljs-string">"https://www.muo.com/"</span> <span class="hljs-attr">target</span>=<span class="hljs-string">"_blank"</span>></span>Go to MUO in a new tab<span class="hljs-tag"></<span class="hljs-name">a</span>></span></code></p></pre>
<p style='text-align: justify;'>نتیجه:</p>
<p style='text-align: justify;'>در یک تب جدید به MUO بروید</p>
<p style='text-align: justify;'>ویژگی “title” یک راهنمای ابزار ایجاد می کند. ماوس را روی پیوند زیر نگه دارید تا ببینید چگونه کار می کند:</p>
<pre><p dir='ltr' style='text-align: left;'><code class="hljs html"><span class="hljs-tag"><<span class="hljs-name">a</span> <span class="hljs-attr">href</span>=<span class="hljs-string">"https://www.muo.com/"</span> <span class="hljs-attr">title</span>=<span class="hljs-string">"This is a tooltip"</span>></span>Hover over this to see the tooltip<span class="hljs-tag"></<span class="hljs-name">a</span>></span></code></p></pre>
<p style='text-align: justify;'>نتیجه:</p>
<p style='text-align: justify;'>برای دیدن راهنمای ابزار، نشانگر را روی آن نگه دارید</p>
<h2>13. <img></h2>
<p style='text-align: justify;'>اگر می خواهید تصویری را در صفحه خود جاسازی کنید، باید از تگ تصویر استفاده کنید. شما معمولاً از آن در ارتباط با ویژگی “src” استفاده می کنید. این منبع تصویر را مشخص می کند، مانند زیر:</p>
<pre><p dir='ltr' style='text-align: left;'><code class="hljs html"><span class="hljs-tag"><<span class="hljs-name">img</span> <span class="hljs-attr">src</span>=<span class="hljs-string">"wp-content/uploads/2019/04/sunlit-birds.jpg"</span>></span></code></p></pre>
<p style='text-align: justify;'>نتیجه:</p>
<p><img class='aligncenter' alt='نمونه ای از تگ img html در حال استفاده' src='https://static1.makeuseofimages.com/wordpress/wp-content/uploads/2023/07/sunlit-birds.jpg' width='700'></p>
<p style='text-align: justify;'>سایر ویژگی‌ها مانند “ارتفاع”، “عرض” و “alt” در دسترس هستند. در اینجا چگونه ممکن است به نظر برسد:</p>
<pre><p dir='ltr' style='text-align: left;'><code class="hljs html"><span class="hljs-tag"><<span class="hljs-name">img</span> <span class="hljs-attr">src</span>=<span class="hljs-string">"wp-content/uploads/2019/04/sunlit-birds.jpg"</span> <span class="hljs-attr">alt</span>=<span class="hljs-string">"the name of your image"</span>></span></code></p></pre>
<p style='text-align: justify;'>همانطور که انتظار دارید، ویژگی های “height” و “width” ارتفاع و عرض تصویر را تعیین می کنند. به طور کلی، ایده خوبی است که فقط یکی از آنها را تنظیم کنید تا تصویر به درستی مقیاس شود. اگر از هر دو استفاده می کنید، می توانید با یک تصویر کشیده یا له شده مواجه شوید.</p>
<p style='text-align: justify;'>تگ “alt” به مرورگر می گوید که اگر تصویر نمایش داده نمی شود، چه متنی را نمایش دهد و باید با هر تصویری اضافه شود. این یک ویژگی دسترس‌پذیری است و صفحه‌خوان‌ها متن جایگزین را با صدای بلند می‌خوانند.</p>
<p style='text-align: justify;'>برای اینکه یک قدم فراتر بروید و عملکرد سایت خود را بهبود ببخشید، به راهنمای ما در مورد نحوه ایجاد تصاویر واکنشگرا در HTML نگاهی بیندازید.</p>
<h2>14. </p>
<ol></h2>
<p style='text-align: justify;'>تگ لیست مرتب به شما امکان می دهد به طور پیش فرض یک لیست شماره گذاری شده ایجاد کنید. هر مورد در لیست به یک تگ آیتم لیست نیاز دارد (</p>
<li>)، بنابراین کد لیست شما به شکل زیر خواهد بود:</p>
<pre><p dir='ltr' style='text-align: left;'><code class="hljs html"><span class="hljs-tag"><<span class="hljs-name">ol</span>></span><br/><span class="hljs-tag"><<span class="hljs-name">li</span>></span>First thing<span class="hljs-tag"></<span class="hljs-name">li</span>></span><br/><span class="hljs-tag"><<span class="hljs-name">li</span>></span>Second thing<span class="hljs-tag"></<span class="hljs-name">li</span>></span><br/><span class="hljs-tag"><<span class="hljs-name">li</span>></span>Third thing<span class="hljs-tag"></<span class="hljs-name">li</span>></span><br/><span class="hljs-tag"></<span class="hljs-name">ol</span>></span></code></p></pre>
<p style='text-align: justify;'>نتیجه:</p>
<ol>
<li>اولین چیز</li>
<li>مورد دوم</li>
<li>مورد سوم</li>
</ol>
<p style='text-align: justify;'>در HTML5 می توانید از </p>
<ol reversed> برای تغییر ترتیب اعداد استفاده کنید. و می توانید مقدار شروع را با ویژگی “شروع” تنظیم کنید.</p>
<p style='text-align: justify;'>ویژگی “type” به شما امکان می دهد به مرورگر بگویید از کدام نوع نماد برای آیتم های لیست از جمله اعداد، حروف و اعداد رومی استفاده کند. می‌توان آن را روی «1»، «A»، «a»، «I» یا «i» تنظیم کرد و فهرست را با نماد نشان‌داده‌شده به شکل زیر نمایش داد:</p>
<pre><p dir='ltr' style='text-align: left;'><code class="hljs html"><span class="hljs-tag"><<span class="hljs-name">ol</span> <span class="hljs-attr">type</span>=<span class="hljs-string">"A"</span>></span></code></p></pre>
<h2>15. </p>
<ul></h2>
<p style='text-align: justify;'>لیست نامرتب بسیار ساده تر از همتای سفارش شده خود است. این به سادگی یک لیست گلوله ای است.</p>
<pre><p dir='ltr' style='text-align: left;'><code class="hljs html"><span class="hljs-tag"><<span class="hljs-name">ul</span>></span><br/><span class="hljs-tag"><<span class="hljs-name">li</span>></span>First item<span class="hljs-tag"></<span class="hljs-name">li</span>></span><br/><span class="hljs-tag"><<span class="hljs-name">li</span>></span>Second item<span class="hljs-tag"></<span class="hljs-name">li</span>></span><br/><span class="hljs-tag"><<span class="hljs-name">li</span>></span>Third item<span class="hljs-tag"></<span class="hljs-name">li</span>></span><br/><span class="hljs-tag"></<span class="hljs-name">ul</span>></span></code></p></pre>
<p style='text-align: justify;'>نتیجه:</p>
<ul>
<li>مورد اول</li>
<li>مورد دوم</li>
<li>مورد سوم</li>
</ul>
<p style='text-align: justify;'>لیست های نامرتب دارای ویژگی «نوع» نیز هستند و می توانید آن را روی «دیسک»، «دایره» یا «مربع» تنظیم کنید.</p>
<h2>16. <جدول></h2>
<p style='text-align: justify;'>در حالی که شما نباید از جداول برای قالب بندی استفاده کنید، مواقع زیادی وجود دارد که می خواهید از سطرها و ستون ها برای تقسیم بندی اطلاعات در صفحه خود استفاده کنید. برای اینکه یک جدول کار کند به چندین تگ نیاز است. این نمونه کد HTML است:</p>
<pre><p dir='ltr' style='text-align: left;'><code class="hljs html"><span class="hljs-tag"><<span class="hljs-name">table</span>></span><br/><span class="hljs-tag"><<span class="hljs-name">tbody</span>></span><br/><span class="hljs-tag"><<span class="hljs-name">tr</span>></span><br/><span class="hljs-tag"><<span class="hljs-name">th</span>></span>1st column<span class="hljs-tag"></<span class="hljs-name">th</span>></span><br/><span class="hljs-tag"><<span class="hljs-name">th</span>></span>2nd column<span class="hljs-tag"></<span class="hljs-name">th</span>></span><br/><span class="hljs-tag"></<span class="hljs-name">tr</span>></span><br/><span class="hljs-tag"><<span class="hljs-name">tr</span>></span><br/><span class="hljs-tag"><<span class="hljs-name">td</span>></span>Row 1, column 1<span class="hljs-tag"></<span class="hljs-name">td</span>></span><br/><span class="hljs-tag"><<span class="hljs-name">td</span>></span>Row 1, column 2<span class="hljs-tag"></<span class="hljs-name">td</span>></span><br/><span class="hljs-tag"></<span class="hljs-name">tr</span>></span><br/><span class="hljs-tag"><<span class="hljs-name">td</span>></span>Row 2, column 1<span class="hljs-tag"></<span class="hljs-name">td</span>></span><br/><span class="hljs-tag"><<span class="hljs-name">td</span>></span>Row 2, column 2<span class="hljs-tag"></<span class="hljs-name">td</span>></span><br/><span class="hljs-tag"></<span class="hljs-name">tbody</span>></span><br/><span class="hljs-tag"></<span class="hljs-name">table</span>></span></code></p></pre>
<p style='text-align: justify;'>تگ های </p>
<table> و </table>
<p> شروع و پایان جدول را مشخص می کنند. تگ </p>
<tbody> حاوی تمام محتوای جدول است.</p>
<p style='text-align: justify;'>هر ردیف از جدول در یک تگ </p>
<tr> محصور شده است. هر سلول درون هر سطر در تگ های </p>
<th> برای سرصفحه های ستون و یا </p>
<td> برای داده های ستون پیچیده شده است. برای هر ستون در هر سطر به یکی از اینها نیاز دارید.</p>
<p style='text-align: justify;'>نتیجه:</p>
<p style='text-align: justify;'>ستون 1</p>
<p style='text-align: justify;'>ستون 2</p>
<p style='text-align: justify;'>ردیف 1، ستون 1</p>
<p style='text-align: justify;'>ردیف 1، ستون 2</p>
<p style='text-align: justify;'>ردیف 2، ستون 1</p>
<p style='text-align: justify;'>ردیف 2، ستون 2</p>
<h2>17. </p>
<blockquote></h2>
<p style='text-align: justify;'>هنگامی که از وب سایت یا شخص دیگری نقل قول می کنید و می خواهید نقل قول را از بقیه سند خود جدا کنید، از تگ blockquote استفاده کنید. تنها کاری که شما باید انجام دهید این است که نقل قول را در باز و بسته کردن برچسب های بلوک نقل قول قرار دهید:</p>
<pre><p dir='ltr' style='text-align: left;'><code class="hljs html"><span class="hljs-tag"><<span class="hljs-name">blockquote</span>></span>The Web as I envisaged it, we have not seen it yet. The future is still so much bigger than the past.<span class="hljs-tag"></<span class="hljs-name">blockquote</span>></span></code></p></pre>
<p style='text-align: justify;'>نتیجه:</p>
<p style='text-align: justify;'>وب را همانطور که من تصور می کردم، هنوز آن را ندیده ایم. آینده هنوز خیلی بزرگتر از گذشته است.</p>
<p style='text-align: justify;'>قالب بندی دقیقی که استفاده می شود ممکن است به مرورگری که استفاده می کنید یا CSS سایت شما بستگی داشته باشد. اما برچسب ثابت می ماند.</p>
<h2>بر این نمونه ها و نمونه های کد HTML مسلط شوید</h2>
<p style='text-align: justify;'>با این 17 مثال کد نویسی HTML، باید بتوانید یک وب سایت ساده ایجاد کنید. می‌توانید هم‌اکنون همه آنها را در یک ویرایشگر متن آنلاین آزمایش کنید تا از نحوه عملکرد آنها مطلع شوید.</p>
<p style='text-align: justify;'>این تنها شروع کاری است که می توانید با برنامه های ساده HTML انجام دهید. پس از تسلط بر اصول اولیه، می توانید شروع به اضافه کردن سایر ویژگی ها و جلوه های جالب کنید تا صفحات خود را حرفه ای تر نشان دهید.</p>
<p><u><a href="https://www.makeuseof.com/tag/simple-html-code-learn-minutes/"target="_blank" rel="noopener noreferrer"><button class="favorite styled" type="button">منبع مقاله</button></a></u></p>
<div style="clear:both; margin-top:0em; margin-bottom:1em;"><a href="https://www.makeuseof.ir/10-%d8%a8%d9%87%d8%aa%d8%b1%db%8c%d9%86-%d8%b1%d9%88%d8%b4-%d9%88%d8%a7%da%a9%d9%86%d8%b4%db%8c-%da%a9%d9%87-%d8%a8%d8%a7%db%8c%d8%af-%d8%af%d8%b1-%d8%b3%d8%a7%d9%84-2022-%d8%af%d9%86%d8%a8%d8%a7/" target="_blank" rel="dofollow" class="u2bbe4d11414f2a0d1a4395f9a265f6e1"><!-- INLINE RELATED POSTS 1/3 //--><style> .u2bbe4d11414f2a0d1a4395f9a265f6e1 { padding:0px; margin: 0; padding-top:1em!important; padding-bottom:1em!important; width:100%; display: block; font-weight:bold; background-color:#464646; border:0!important; border-left:4px solid #464646!important; text-decoration:none; } .u2bbe4d11414f2a0d1a4395f9a265f6e1:active, .u2bbe4d11414f2a0d1a4395f9a265f6e1:hover { opacity: 1; transition: opacity 250ms; webkit-transition: opacity 250ms; text-decoration:none; } .u2bbe4d11414f2a0d1a4395f9a265f6e1 { transition: background-color 250ms; webkit-transition: background-color 250ms; opacity: 1; transition: opacity 250ms; webkit-transition: opacity 250ms; } .u2bbe4d11414f2a0d1a4395f9a265f6e1 .ctaText { font-weight:bold; color:#27AE60; text-decoration:none; font-size: 16px; } .u2bbe4d11414f2a0d1a4395f9a265f6e1 .postTitle { color:#C0392B; text-decoration: underline!important; font-size: 16px; } .u2bbe4d11414f2a0d1a4395f9a265f6e1:hover .postTitle { text-decoration: underline!important; } </style><div style="padding-left:1em; padding-right:1em;"><span class="ctaText">مطلب مرتبط: </span> <span class="postTitle">10 بهترین روش واکنشی که باید در سال 2022 دنبال کنید</span></div></a></div> <div class="post-item-metadata entry-meta">
<span class="tags-links">Tags: <a href="https://www.makeuseof.ir/tag/coding-tutorials/" rel="tag">آموزش کد نویسی</a> <a href="https://www.makeuseof.ir/tag/html/" rel="tag">اچ تی ام ال</a> <a href="https://www.makeuseof.ir/tag/html-5/" rel="tag">اچ‌تی‌ام‌ال ۵</a> <a href="https://www.makeuseof.ir/tag/web-development/" rel="tag">توسعه وب</a> <a href="https://www.makeuseof.ir/tag/web-design/" rel="tag">طراحی وب سایت</a> <a href="https://www.makeuseof.ir/tag/coding-tips/" rel="tag">نکات کد نویسی</a></span> </div>
<nav class="navigation post-navigation" aria-label="Continue Reading">
<h2 class="screen-reader-text">Continue Reading</h2>
<div class="nav-links"><div class="nav-previous"><a href="https://www.makeuseof.ir/%d8%a2%d9%85%d9%88%d8%b2%d8%b4-%d9%86%d8%ad%d9%88%d9%87-%d9%86%d9%88%d8%b4%d8%aa%d9%86-%d9%81%d8%a7%db%8c%d9%84-%d8%af%d8%b1-node/" rel="prev"><span class="em-post-navigation">Previous</span> آموزش نحوه نوشتن فایل در Node</a></div><div class="nav-next"><a href="https://www.makeuseof.ir/%d9%86%d8%ad%d9%88%d9%87-%d8%b5%d8%a7%d9%81-%da%a9%d8%b1%d8%af%d9%86-%db%8c%da%a9-%d9%84%db%8c%d8%b3%d8%aa-%d8%aa%d9%88%d8%af%d8%b1%d8%aa%d9%88-%d8%af%d8%b1-%d9%be%d8%a7%db%8c%d8%aa%d9%88%d9%86/" rel="next"><span class="em-post-navigation">Next</span> نحوه صاف کردن یک لیست تودرتو در پایتون</a></div></div>
</nav> </div><!-- .entry-content -->
</div>
<div class="aft-comment-related-wrap">
</div>
</article>
</main><!-- #main -->
</div><!-- #primary -->
</div>
</div>
<footer class="site-footer">
<div class="primary-footer">
<div class="container-wrapper">
<div class="af-container-row clearfix">
<div class="primary-footer-area footer-first-widgets-section col-md-4 col-sm-12">
<section class="widget-area color-pad">
<div id="tag_cloud-2" class="widget enternews-widget widget_tag_cloud"><h2 class="widget-title widget-title-1"><span class="header-after">برچسب‌ها</span></h2><div class="tagcloud"><a href="https://www.makeuseof.ir/tag/online-tools/" class="tag-cloud-link tag-link-333 tag-link-position-1" style="font-size: 8pt;" aria-label="ابزارهای آنلاین (325 مورد)">ابزارهای آنلاین</a>
<a href="https://www.makeuseof.ir/tag/ethereum/" class="tag-cloud-link tag-link-407 tag-link-position-2" style="font-size: 10.470588235294pt;" aria-label="اتریوم (451 مورد)">اتریوم</a>
<a href="https://www.makeuseof.ir/tag/cryptocurrency/" class="tag-cloud-link tag-link-384 tag-link-position-3" style="font-size: 14.258823529412pt;" aria-label="ارز رمزنگاری شده (779 مورد)">ارز رمزنگاری شده</a>
<a href="https://www.makeuseof.ir/tag/online-security/" class="tag-cloud-link tag-link-265 tag-link-position-4" style="font-size: 15.082352941176pt;" aria-label="امنیت آنلاین (863 مورد)">امنیت آنلاین</a>
<a href="https://www.makeuseof.ir/tag/cybersecurity/" class="tag-cloud-link tag-link-382 tag-link-position-5" style="font-size: 11.129411764706pt;" aria-label="امنیت سایبری (498 مورد)">امنیت سایبری</a>
<a href="https://www.makeuseof.ir/tag/apple/" class="tag-cloud-link tag-link-647 tag-link-position-6" style="font-size: 11.952941176471pt;" aria-label="اپل (563 مورد)">اپل</a>
<a href="https://www.makeuseof.ir/tag/ios-apps/" class="tag-cloud-link tag-link-257 tag-link-position-7" style="font-size: 12.611764705882pt;" aria-label="اپلیکیشن های آی اواس (611 مورد)">اپلیکیشن های آی اواس</a>
<a href="https://www.makeuseof.ir/tag/pc-gaming/" class="tag-cloud-link tag-link-302 tag-link-position-8" style="font-size: 12.776470588235pt;" aria-label="بازی کامپیوتری (627 مورد)">بازی کامپیوتری</a>
<a href="https://www.makeuseof.ir/tag/programming/" class="tag-cloud-link tag-link-317 tag-link-position-9" style="font-size: 15.082352941176pt;" aria-label="برنامه نويسی (877 مورد)">برنامه نويسی</a>
<a href="https://www.makeuseof.ir/tag/android-apps/" class="tag-cloud-link tag-link-181 tag-link-position-10" style="font-size: 13.6pt;" aria-label="برنامه های اندروید (706 مورد)">برنامه های اندروید</a>
<a href="https://www.makeuseof.ir/tag/blockchain/" class="tag-cloud-link tag-link-385 tag-link-position-11" style="font-size: 12.776470588235pt;" aria-label="بلاک چین (628 مورد)">بلاک چین</a>
<a href="https://www.makeuseof.ir/tag/bitcoin/" class="tag-cloud-link tag-link-386 tag-link-position-12" style="font-size: 10.964705882353pt;" aria-label="بیت کوین (492 مورد)">بیت کوین</a>
<a href="https://www.makeuseof.ir/tag/fitness/" class="tag-cloud-link tag-link-207 tag-link-position-13" style="font-size: 10.305882352941pt;" aria-label="تناسب اندام (446 مورد)">تناسب اندام</a>
<a href="https://www.makeuseof.ir/tag/web-development/" class="tag-cloud-link tag-link-315 tag-link-position-14" style="font-size: 9.4823529411765pt;" aria-label="توسعه وب (399 مورد)">توسعه وب</a>
<a href="https://www.makeuseof.ir/tag/javascript/" class="tag-cloud-link tag-link-438 tag-link-position-15" style="font-size: 8.3294117647059pt;" aria-label="جاوا اسکریپت (341 مورد)">جاوا اسکریپت</a>
<a href="https://www.makeuseof.ir/tag/media-streaming/" class="tag-cloud-link tag-link-167 tag-link-position-16" style="font-size: 13.929411764706pt;" aria-label="جریان سازی رسانه ای (747 مورد)">جریان سازی رسانه ای</a>
<a href="https://www.makeuseof.ir/tag/privacy/" class="tag-cloud-link tag-link-266 tag-link-position-17" style="font-size: 10.470588235294pt;" aria-label="حریم خصوصی (455 مورد)">حریم خصوصی</a>
<a href="https://www.makeuseof.ir/tag/windows-errors/" class="tag-cloud-link tag-link-241 tag-link-position-18" style="font-size: 14.258823529412pt;" aria-label="خطاهای ویندوز (774 مورد)">خطاهای ویندوز</a>
<a href="https://www.makeuseof.ir/tag/social-media/" class="tag-cloud-link tag-link-157 tag-link-position-19" style="font-size: 14.258823529412pt;" aria-label="رسانه های اجتماعی (782 مورد)">رسانه های اجتماعی</a>
<a href="https://www.makeuseof.ir/tag/samsung-galaxy/" class="tag-cloud-link tag-link-260 tag-link-position-20" style="font-size: 8.9882352941176pt;" aria-label="سامسونگ گلکسی (373 مورد)">سامسونگ گلکسی</a>
<a href="https://www.makeuseof.ir/tag/mental-health/" class="tag-cloud-link tag-link-326 tag-link-position-21" style="font-size: 8.1647058823529pt;" aria-label="سلامت روان (329 مورد)">سلامت روان</a>
<a href="https://www.makeuseof.ir/tag/health/" class="tag-cloud-link tag-link-325 tag-link-position-22" style="font-size: 13.105882352941pt;" aria-label="سلامتی (660 مورد)">سلامتی</a>
<a href="https://www.makeuseof.ir/tag/photos/" class="tag-cloud-link tag-link-209 tag-link-position-23" style="font-size: 10.635294117647pt;" aria-label="عکس ها (467 مورد)">عکس ها</a>
<a href="https://www.makeuseof.ir/tag/troubleshooting/" class="tag-cloud-link tag-link-458 tag-link-position-24" style="font-size: 12.282352941176pt;" aria-label="عیب یابی (590 مورد)">عیب یابی</a>
<a href="https://www.makeuseof.ir/tag/website-lists/" class="tag-cloud-link tag-link-535 tag-link-position-25" style="font-size: 8.1647058823529pt;" aria-label="لیست های وب سایت (327 مورد)">لیست های وب سایت</a>
<a href="https://www.makeuseof.ir/tag/electric-car/" class="tag-cloud-link tag-link-547 tag-link-position-26" style="font-size: 9.8117647058824pt;" aria-label="ماشین الکتریکی (418 مورد)">ماشین الکتریکی</a>
<a href="https://www.makeuseof.ir/tag/travel/" class="tag-cloud-link tag-link-323 tag-link-position-27" style="font-size: 8.6588235294118pt;" aria-label="مسافرت رفتن (350 مورد)">مسافرت رفتن</a>
<a href="https://www.makeuseof.ir/tag/careers/" class="tag-cloud-link tag-link-231 tag-link-position-28" style="font-size: 9.3176470588235pt;" aria-label="مشاغل (392 مورد)">مشاغل</a>
<a href="https://www.makeuseof.ir/tag/iphone-tips/" class="tag-cloud-link tag-link-189 tag-link-position-29" style="font-size: 12.941176470588pt;" aria-label="نکات آیفون (641 مورد)">نکات آیفون</a>
<a href="https://www.makeuseof.ir/tag/android-tips/" class="tag-cloud-link tag-link-164 tag-link-position-30" style="font-size: 12.776470588235pt;" aria-label="نکات اندروید (637 مورد)">نکات اندروید</a>
<a href="https://www.makeuseof.ir/tag/gaming-tips/" class="tag-cloud-link tag-link-216 tag-link-position-31" style="font-size: 8.9882352941176pt;" aria-label="نکات بازی (368 مورد)">نکات بازی</a>
<a href="https://www.makeuseof.ir/tag/buying-tips/" class="tag-cloud-link tag-link-339 tag-link-position-32" style="font-size: 12.776470588235pt;" aria-label="نکات خرید (627 مورد)">نکات خرید</a>
<a href="https://www.makeuseof.ir/tag/hardware-tips/" class="tag-cloud-link tag-link-559 tag-link-position-33" style="font-size: 12.117647058824pt;" aria-label="نکات سخت افزاری (573 مورد)">نکات سخت افزاری</a>
<a href="https://www.makeuseof.ir/tag/mac-tips/" class="tag-cloud-link tag-link-394 tag-link-position-34" style="font-size: 10.964705882353pt;" aria-label="نکات مک (491 مورد)">نکات مک</a>
<a href="https://www.makeuseof.ir/tag/image-editing-tips/" class="tag-cloud-link tag-link-165 tag-link-position-35" style="font-size: 8.1647058823529pt;" aria-label="نکات ویرایش تصویر (331 مورد)">نکات ویرایش تصویر</a>
<a href="https://www.makeuseof.ir/tag/windows-tips/" class="tag-cloud-link tag-link-291 tag-link-position-36" style="font-size: 11.952941176471pt;" aria-label="نکات ویندوز (562 مورد)">نکات ویندوز</a>
<a href="https://www.makeuseof.ir/tag/artificial-intelligence/" class="tag-cloud-link tag-link-502 tag-link-position-37" style="font-size: 16.564705882353pt;" aria-label="هوش مصنوعی (1,066 مورد)">هوش مصنوعی</a>
<a href="https://www.makeuseof.ir/tag/image-editors/" class="tag-cloud-link tag-link-255 tag-link-position-38" style="font-size: 8pt;" aria-label="ویرایشگرهای تصویر (319 مورد)">ویرایشگرهای تصویر</a>
<a href="https://www.makeuseof.ir/tag/windows-10/" class="tag-cloud-link tag-link-240 tag-link-position-39" style="font-size: 20.023529411765pt;" aria-label="ویندوز 10 (1,754 مورد)">ویندوز 10</a>
<a href="https://www.makeuseof.ir/tag/windows-11/" class="tag-cloud-link tag-link-178 tag-link-position-40" style="font-size: 22pt;" aria-label="ویندوز 11 (2,294 مورد)">ویندوز 11</a>
<a href="https://www.makeuseof.ir/tag/chatgpt/" class="tag-cloud-link tag-link-1534 tag-link-position-41" style="font-size: 11.458823529412pt;" aria-label="چت جی پی تی (518 مورد)">چت جی پی تی</a>
<a href="https://www.makeuseof.ir/tag/scam/" class="tag-cloud-link tag-link-525 tag-link-position-42" style="font-size: 8pt;" aria-label="کلاهبرداری (323 مورد)">کلاهبرداری</a>
<a href="https://www.makeuseof.ir/tag/google/" class="tag-cloud-link tag-link-308 tag-link-position-43" style="font-size: 8.3294117647059pt;" aria-label="گوگل (337 مورد)">گوگل</a>
<a href="https://www.makeuseof.ir/tag/google-chrome/" class="tag-cloud-link tag-link-295 tag-link-position-44" style="font-size: 8.9882352941176pt;" aria-label="گوگل کروم (374 مورد)">گوگل کروم</a>
<a href="https://www.makeuseof.ir/tag/youtube/" class="tag-cloud-link tag-link-374 tag-link-position-45" style="font-size: 8.1647058823529pt;" aria-label="یوتیوب (332 مورد)">یوتیوب</a></div>
</div> </section>
</div>
<div class="primary-footer-area footer-second-widgets-section col-md-4 col-sm-12">
<section class="widget-area color-pad">
<div id="tag_cloud-1" class="widget enternews-widget widget_tag_cloud"><h2 class="widget-title widget-title-1"><span class="header-after">موضوعات</span></h2><div class="tagcloud"><a href="https://www.makeuseof.ir/category/ios/" class="tag-cloud-link tag-link-3 tag-link-position-1" style="font-size: 21.461538461538pt;" aria-label="آی اواس (3,014 مورد)">آی اواس<span class="tag-link-count"> (3014)</span></a>
<a href="https://www.makeuseof.ir/category/promoted/" class="tag-cloud-link tag-link-1642 tag-link-position-2" style="font-size: 8pt;" aria-label="ارتقاء یافت (2 مورد)">ارتقاء یافت<span class="tag-link-count"> (2)</span></a>
<a href="https://www.makeuseof.ir/category/security/" class="tag-cloud-link tag-link-7 tag-link-position-3" style="font-size: 21.102564102564pt;" aria-label="امنیت (2,483 مورد)">امنیت<span class="tag-link-count"> (2483)</span></a>
<a href="https://www.makeuseof.ir/category/google-android/" class="tag-cloud-link tag-link-50 tag-link-position-4" style="font-size: 21.282051282051pt;" aria-label="اندروید (2,782 مورد)">اندروید<span class="tag-link-count"> (2782)</span></a>
<a href="https://www.makeuseof.ir/category/web-based/" class="tag-cloud-link tag-link-6 tag-link-position-5" style="font-size: 21.192307692308pt;" aria-label="اینترنت (2,638 مورد)">اینترنت<span class="tag-link-count"> (2638)</span></a>
<a href="https://www.makeuseof.ir/category/games/" class="tag-cloud-link tag-link-62 tag-link-position-6" style="font-size: 20.74358974359pt;" aria-label="بازی (2,068 مورد)">بازی<span class="tag-link-count"> (2068)</span></a>
<a href="https://www.makeuseof.ir/category/product-reviews/" class="tag-cloud-link tag-link-76 tag-link-position-7" style="font-size: 17.916666666667pt;" aria-label="بررسی محصول (491 مورد)">بررسی محصول<span class="tag-link-count"> (491)</span></a>
<a href="https://www.makeuseof.ir/category/programming/" class="tag-cloud-link tag-link-8 tag-link-position-8" style="font-size: 20.070512820513pt;" aria-label="برنامه نویسی (1,479 مورد)">برنامه نویسی<span class="tag-link-count"> (1479)</span></a>
<a href="https://www.makeuseof.ir/category/best-deals/" class="tag-cloud-link tag-link-369 tag-link-position-9" style="font-size: 16.974358974359pt;" aria-label="بهترینها (300 مورد)">بهترینها<span class="tag-link-count"> (300)</span></a>
<a href="https://www.makeuseof.ir/category/productivity/" class="tag-cloud-link tag-link-48 tag-link-position-10" style="font-size: 20.878205128205pt;" aria-label="بهره وری (2,239 مورد)">بهره وری<span class="tag-link-count"> (2239)</span></a>
<a href="https://www.makeuseof.ir/category/technology-explained/" class="tag-cloud-link tag-link-68 tag-link-position-11" style="font-size: 21.910256410256pt;" aria-label="تکنولوژی (3,811 مورد)">تکنولوژی<span class="tag-link-count"> (3811)</span></a>
<a href="https://www.makeuseof.ir/category/sponsored/" class="tag-cloud-link tag-link-552 tag-link-position-12" style="font-size: 17.826923076923pt;" aria-label="حمایت شده (469 مورد)">حمایت شده<span class="tag-link-count"> (469)</span></a>
<a href="https://www.makeuseof.ir/category/transportation/" class="tag-cloud-link tag-link-931 tag-link-position-13" style="font-size: 9.3461538461538pt;" aria-label="حمل و نقل (5 مورد)">حمل و نقل<span class="tag-link-count"> (5)</span></a>
<a href="https://www.makeuseof.ir/category/smart-home/" class="tag-cloud-link tag-link-72 tag-link-position-14" style="font-size: 19.307692307692pt;" aria-label="خانه هوشمند (997 مورد)">خانه هوشمند<span class="tag-link-count"> (997)</span></a>
<a href="https://www.makeuseof.ir/category/news/" class="tag-cloud-link tag-link-169 tag-link-position-15" style="font-size: 17.602564102564pt;" aria-label="خبرها (416 مورد)">خبرها<span class="tag-link-count"> (416)</span></a>
<a href="https://www.makeuseof.ir/category/creative/" class="tag-cloud-link tag-link-60 tag-link-position-16" style="font-size: 20.967948717949pt;" aria-label="خلاقیت (2,324 مورد)">خلاقیت<span class="tag-link-count"> (2324)</span></a>
<a href="https://www.makeuseof.ir/category/electric-vehicles/" class="tag-cloud-link tag-link-1488 tag-link-position-17" style="font-size: 17.423076923077pt;" aria-label="خودروهای برقی (383 مورد)">خودروهای برقی<span class="tag-link-count"> (383)</span></a>
<a href="https://www.makeuseof.ir/category/buying-guides/" class="tag-cloud-link tag-link-70 tag-link-position-18" style="font-size: 18.634615384615pt;" aria-label="راهنمای خرید (705 مورد)">راهنمای خرید<span class="tag-link-count"> (705)</span></a>
<a href="https://www.makeuseof.ir/category/lifestyle/" class="tag-cloud-link tag-link-1602 tag-link-position-19" style="font-size: 8pt;" aria-label="سبک زندگی (2 مورد)">سبک زندگی<span class="tag-link-count"> (2)</span></a>
<a href="https://www.makeuseof.ir/category/hardware/" class="tag-cloud-link tag-link-1661 tag-link-position-20" style="font-size: 13.384615384615pt;" aria-label="سخت افزار (47 مورد)">سخت افزار<span class="tag-link-count"> (47)</span></a>
<a href="https://www.makeuseof.ir/category/entertainment/" class="tag-cloud-link tag-link-9 tag-link-position-21" style="font-size: 20.564102564103pt;" aria-label="سرگرمی (1,924 مورد)">سرگرمی<span class="tag-link-count"> (1924)</span></a>
<a href="https://www.makeuseof.ir/category/wellness/" class="tag-cloud-link tag-link-66 tag-link-position-22" style="font-size: 19.576923076923pt;" aria-label="سلامتی (1,157 مورد)">سلامتی<span class="tag-link-count"> (1157)</span></a>
<a href="https://www.makeuseof.ir/category/social-media/" class="tag-cloud-link tag-link-64 tag-link-position-23" style="font-size: 20.384615384615pt;" aria-label="شبکه اجتماعی (1,719 مورد)">شبکه اجتماعی<span class="tag-link-count"> (1719)</span></a>
<a href="https://www.makeuseof.ir/category/work-career/" class="tag-cloud-link tag-link-58 tag-link-position-24" style="font-size: 19.128205128205pt;" aria-label="شغل (921 مورد)">شغل<span class="tag-link-count"> (921)</span></a>
<a href="https://www.makeuseof.ir/category/%d8%b9%d9%85%d9%88%d9%85%db%8c/" class="tag-cloud-link tag-link-1 tag-link-position-25" style="font-size: 12.038461538462pt;" aria-label="عمومی (23 مورد)">عمومی<span class="tag-link-count"> (23)</span></a>
<a href="https://www.makeuseof.ir/category/apple-watch-troubleshooting/" class="tag-cloud-link tag-link-1616 tag-link-position-26" style="font-size: 10.108974358974pt;" aria-label="عیب یابی اپل واچ (8 مورد)">عیب یابی اپل واچ<span class="tag-link-count"> (8)</span></a>
<a href="https://www.makeuseof.ir/category/linux/" class="tag-cloud-link tag-link-5 tag-link-position-27" style="font-size: 19.576923076923pt;" aria-label="لینوکس (1,137 مورد)">لینوکس<span class="tag-link-count"> (1137)</span></a>
<a href="https://www.makeuseof.ir/category/other/" class="tag-cloud-link tag-link-1628 tag-link-position-28" style="font-size: 11.00641025641pt;" aria-label="متفرقه (13 مورد)">متفرقه<span class="tag-link-count"> (13)</span></a>
<a href="https://www.makeuseof.ir/category/deals/" class="tag-cloud-link tag-link-799 tag-link-position-29" style="font-size: 14.820512820513pt;" aria-label="معاملات (98 مورد)">معاملات<span class="tag-link-count"> (98)</span></a>
<a href="https://www.makeuseof.ir/category/mac/" class="tag-cloud-link tag-link-4 tag-link-position-30" style="font-size: 19.75641025641pt;" aria-label="مکینتاش (1,256 مورد)">مکینتاش<span class="tag-link-count"> (1256)</span></a>
<a href="https://www.makeuseof.ir/category/partners/" class="tag-cloud-link tag-link-1564 tag-link-position-31" style="font-size: 10.333333333333pt;" aria-label="همکارها (9 مورد)">همکارها<span class="tag-link-count"> (9)</span></a>
<a href="https://www.makeuseof.ir/category/windows/" class="tag-cloud-link tag-link-2 tag-link-position-32" style="font-size: 22pt;" aria-label="ویندوز (3,961 مورد)">ویندوز<span class="tag-link-count"> (3961)</span></a>
<a href="https://www.makeuseof.ir/category/diy-projects/" class="tag-cloud-link tag-link-74 tag-link-position-33" style="font-size: 18.724358974359pt;" aria-label="پروژه های دست ساز (742 مورد)">پروژه های دست ساز<span class="tag-link-count"> (742)</span></a>
<a href="https://www.makeuseof.ir/category/pc-mobile/" class="tag-cloud-link tag-link-1601 tag-link-position-34" style="font-size: 8.5384615384615pt;" aria-label="کامپیوتر و موبایل (3 مورد)">کامپیوتر و موبایل<span class="tag-link-count"> (3)</span></a>
<a href="https://www.makeuseof.ir/category/business/" class="tag-cloud-link tag-link-1617 tag-link-position-35" style="font-size: 9.3461538461538pt;" aria-label="کسب و کار (5 مورد)">کسب و کار<span class="tag-link-count"> (5)</span></a></div>
</div> </section>
</div>
<div class="primary-footer-area footer-third-widgets-section col-md-4 col-sm-12">
<section class="widget-area color-pad">
<div id="text-1" class="widget enternews-widget widget_text"><h2 class="widget-title widget-title-1"><span class="header-after">حمایت</span></h2> <div class="textwidget"><p><strong>در صورتی که از مطالب این سایت استفاده کردید و تمایل به حمایت از این سایت داشتید میتونید از طریق ارز دیجیتال ترون به ما کمک کنید.</strong></p>
<p>TXpgV7THPGMPqEiu2dtQ2LbqHJQFSmmj8x</p>
</div>
</div><div id="media_image-6" class="widget enternews-widget widget_media_image"><figure style="width: 150px" class="wp-caption alignnone"><img width="150" height="150" src="https://www.makeuseof.ir/wp-content/uploads/2022/07/tron-150x150.jpg" class="image wp-image-1052 attachment-thumbnail size-thumbnail" alt="حمایت مالی" style="max-width: 100%; height: auto;" title="TXpgV7THPGMPqEiu2dtQ2LbqHJQFSmmj8x" decoding="async" loading="lazy" srcset="https://www.makeuseof.ir/wp-content/uploads/2022/07/tron-150x150.jpg 150w, https://www.makeuseof.ir/wp-content/uploads/2022/07/tron-300x300.jpg 300w, https://www.makeuseof.ir/wp-content/uploads/2022/07/tron.jpg 421w" sizes="auto, (max-width: 150px) 100vw, 150px" /><figcaption class="wp-caption-text">حمایت مالی</figcaption></figure></div> </section>
</div>
</div>
</div>
</div>
<div class="secondary-footer">
<div class="container-wrapper">
<div class="af-container-row clearfix af-flex-container">
<div class="float-l pad color-pad col-1">
<div class="footer-nav-wrapper">
<div class="footer-navigation"><ul id="footer-menu" class="menu"><li id="menu-item-21625" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-21625"><a href="https://twitter.com/MakeUseOfir">توییتر</a></li>
<li id="menu-item-21626" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-21626"><a href="https://www.tumblr.com/blog/view/makeuseofir">تامبلر</a></li>
<li id="menu-item-42198" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-42198"><a href="mailto:info@makeuseof.ir">ایمیل</a></li>
<li id="menu-item-883" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-883"><a href="http://t.me/makeuseof">تلگرام</a></li>
</ul></div> </div>
</div>
</div>
</div>
</div>
<div class="site-info">
<div class="container-wrapper">
<div class="af-container-row">
<div class="col-1 color-pad">
<span class="sep"> | </span>
استفاده از این سایت کاملا آزاد است! </div>
</div>
</div>
</div>
</footer>
</div>
<a id="scroll-up" class="secondary-color">
<i class="fa fa-angle-up"></i>
</a>
<script>
document.addEventListener("DOMContentLoaded", (event) => {
document.body.onselectstart = () => false;
document.body.oncopy = (e) => {
e.preventDefault();
return false;
};
});
</script><script>
document.addEventListener("contextmenu", function(e) {
e.preventDefault();
});
</script><script type="text/javascript" src="https://www.makeuseof.ir/wp-content/themes/enternews/js/navigation.js?ver=20151215" id="enternews-navigation-js"></script>
<script type="text/javascript" src="https://www.makeuseof.ir/wp-content/themes/enternews/js/skip-link-focus-fix.js?ver=20151215" id="enternews-skip-link-focus-fix-js"></script>
<script type="text/javascript" src="https://www.makeuseof.ir/wp-content/themes/enternews/assets/slick/js/slick.min.js?ver=6.7.2" id="slick-js-js"></script>
<script type="text/javascript" src="https://www.makeuseof.ir/wp-content/themes/enternews/assets/bootstrap/js/bootstrap.min.js?ver=6.7.2" id="bootstrap-js"></script>
<script type="text/javascript" src="https://www.makeuseof.ir/wp-content/themes/enternews/assets/sidr/js/jquery.sidr.min.js?ver=6.7.2" id="sidr-js"></script>
<script type="text/javascript" src="https://www.makeuseof.ir/wp-content/themes/enternews/assets/magnific-popup/jquery.magnific-popup.min.js?ver=6.7.2" id="magnific-popup-js"></script>
<script type="text/javascript" src="https://www.makeuseof.ir/wp-content/themes/enternews/assets/jquery-match-height/jquery.matchHeight.min.js?ver=6.7.2" id="matchheight-js"></script>
<script type="text/javascript" src="https://www.makeuseof.ir/wp-content/themes/enternews/assets/marquee/jquery.marquee.js?ver=6.7.2" id="marquee-js"></script>
<script type="text/javascript" src="https://www.makeuseof.ir/wp-content/themes/enternews/assets/theiaStickySidebar/theia-sticky-sidebar.min.js?ver=6.7.2" id="sticky-sidebar-js"></script>
<script type="text/javascript" src="https://www.makeuseof.ir/wp-includes/js/imagesloaded.min.js?ver=5.0.0" id="imagesloaded-js"></script>
<script type="text/javascript" src="https://www.makeuseof.ir/wp-includes/js/masonry.min.js?ver=4.2.2" id="masonry-js"></script>
<script type="text/javascript" src="https://www.makeuseof.ir/wp-content/themes/enternews/assets/script.js?ver=6.7.2" id="enternews-script-js"></script>
</body>
</html>
