Police Icon / HTML

HTML-CSS
#1

Hello,

i try to download and use police icon from https://fontawesome.com/, but it doesn’t work(see picture and the code).
Thanks in advance .

HTML:

TYPE html>
<html>
	<head>
		<TITLE>Reservia</TITLE>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="ie=edge">
	    <link rel="stylesheet" type="text/css" href="Reservia.css"> 
		<link rel="stylesheet" type="text/css" href="/css/all.min.css">  
		    	
</head>
<body>
	<header class="hello" >
		<img src="reservia@3x.png" alt="logo"> <! -- Le logo doit être à l'intérieur de header -->
	
		 <menu >
		 	<nav >
		 		<a class="cat blue" href="#">Hébergements</a>
				<a class="black" href="#">Activités</a>
				<a class="blue" href="#">S'inscrire</a>
			</nav>
		
        </menu>
    </header>
      
     	<h1>Trouvez votre hébergement pour des vacances de rêve</h1><br>


	    <h2>En plein centre ville ou en pleine nature</h2>

       
        <i class="fas fa-map-marker-alt"></i>

	    <form name="champs-recherche" action="traitement.php" method="post">

     <input type="searche" name="">

	</form>

    <main>
    	

    </main>










	
		


 
</label>
</menu>

<nav> 

</nav>


<footer>
	
</footer>

</body>
</html>

SCC:


body
{
	font-family:RALEWAY; /* déjà téléchatgé, à installer/copier et entrer dans css*/
}
.hello
{
display:flex;
justify-content:space-between;
}

a 
{
margin-right: 20px;
text-decoration: none;
}

.blue
{
color:#0065FC;
}

.black
{
	color: black;
}

.cat
{
	 border-top:3px solid #0065FC;
}

Capture d’écran 2020-11-24 à 18.53.26
Capture d’écran 2020-11-24 à 18.53.261532×544 109 KB

#2

HI @Loussine!

You need to use the proper link for the font awesome icons.

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.1/css/all.min.css" integrity="sha512-+4zCK9k+qNFUR5X+cKL9EIR+ZOhtIloNl9GIKS57V1MyNsYpYcUrUeQc9vNfzsWfV28IaLL3i96P9sdNyeRssA==" crossorigin="anonymous" />

map icon

1 Like
#3

Thank you very much , it works, but I have a question.

I already downloaded the polices on my PC , in the same folder as all documents for the project(see pictures)…

On my version, the link is going to the folders of polices , why doesn’t work this version?

Thank you din advance. <3

#4

code
code986×251 34.5 KB

#5

folder
folder1818×1028 247 KB

#6

I have only used the cdn link but when I look at the documentation it looks like you have to reference the folder in the link.

Example from font awesome site

<head>
  <link href="/your-path-to-fontawesome/css/all.css" rel="stylesheet"> <!--load all styles -->
</head>
<body>
  <i class="fas fa-user"></i> <!-- uses solid style -->
  <i class="far fa-user"></i> <!-- uses regular style -->
  <i class="fal fa-user"></i> <!-- uses light style -->
  <!--brand icon-->
  <i class="fab fa-github-square"></i> <!-- uses brands style -->
</body>

I would dig around the documentation for the answers.

Hope that helps!

1 Like
#7