شبه المان

1400/02/29

شبه المان :

با سلام

در مبحث شبه المان ها من میخواستم قبل از تگ "h1" آیکون بندازم. من رفتم در سایت Font awesome و آدرس فونت هارو هم به صفحه Html لینک کردم و در سند css کد زیر رو نوشتم:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="Style.css"></head>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<body>

<h1>My Home</h1>

</body>
</html>

h1::before{

فقط مشکلم اینجاست که نمیدونم باید اینجا چه بنویسم تا بتونم از آیکون ها 

.استفاده بکنم
}

رامین جوشنگ

دانیال تیموری

1400/02/29
ساعت 19:19

سلام وقت بخیر

در سایت خود Font awesome برای اینکه بتونید نمایش بدید توضیح داده

مثلا این کد یک ماشین نمایش میده

<i class="fas fa-car"></i>

رامین جوشنگ

1400/02/29
ساعت 19:55

ببین دوست عزیز به صورت معمولی میتونم استفاده بکنم از آیکون ها.

من میخوام با شبه المان ها استفاده کنم یعنی بتونم با before و after آیکون رو هر دو طرف متنم استفاده بکنم‌.

twins_1386

1400/02/30
ساعت 09:54

آها بله شما باید از این کد استفاده کنین. یادتون نره رفرنس بدین فونت هارو توی سی اس اس.

البته به نظرم لزومی نداره می تونین به حالت عادی استفاده کنین.

h1::before{
content:"\f834";
}

<i class="fas fa-car"></i>
<h1>My home</h1>

رفرنس هایی که باید بدین. فقط ممکنه شما مسیرتون متفاوت باشه.

@font-face{
	font-family:'FontAwesome';
	src:url('../fonts/fontawesome-webfont.eot?v=4.7.0');
	src:url('../fonts/fontawesome-webfont.eot?#iefix&amp;v=4.7.0') format('embedded-opentype'),url('../fonts/fontawesome-webfont.woff2?v=4.7.0') format('woff2'),url('../fonts/fontawesome-webfont.woff?v=4.7.0') format('woff'),url('../fonts/fontawesome-webfont.ttf?v=4.7.0') format('truetype'),url('../fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular') format('svg');
	font-weight:normal;
	font-style:normal
}

حسن خسروجردی

1400/02/30
ساعت 10:13

با سلام خدمت شما همراه عزیز

لینک زیر کمکتون میکنه

https://stackoverflow.com/questions/20782368/use-font-awesome-icon-as-css-content