My first project: a tribute page to Batman

My first project: a tribute page to Batman
0.0 0

#1

Hi, i 've just built my first project on freecodecamp and i’d like to receive some advice from you guys.
I’m sorry for my bad english but i’m italian and this is the best i can.
Here is my HTML code:

<div clas="container">
  <div class="row">
    <div class="col-sm-12">
<h2 class="text-succes text-center">Una pagina di tributo a</h2>
<h1 style="color:red" class="text-center">Batman</h1>
<img src="https://i2.wp.com/www.badcomics.it/wp/wp-content/uploads-badcomics/batman1.jpg" alt="Il Cavaliere Oscuro" style="width:100%; height:auto;">
 <p> <span class="redText boldText">Batman</span> 
    (originariamente noto come The Bat-Man ovvero l'uomo pipistrello) è un personaggio immaginario ideato da Bob Kane e Bill Finger, protagonista di storie a fumetti pubblicate negli Stati Uniti d'America dalla DC Comics. Fece il suo esordio nel maggio 1939 sul n. 27 della testata Detective Comics, ed è diventato una delle icone più importanti del fumetto supereroico; una copia dell'albo di esordio ha raggiunto quotazioni di quasi <span class="boldText">1,4 milioni di dollari</span>.
      Batman è l'identità segreta di Bruce Wayne, ricchissimo uomo d'affari che, dopo aver assistito da bambino all'assassinio dei propri genitori da parte di un ladro, decide di intraprendere una personale guerra contro il crimine indossando un costume da pipistrello per incutere timore negli avversari.</p>
      <h3 class="text-center">Si può leggere l'intera scheda del Cavaliere Oscuro <a href="https://it.wikipedia.org/wiki/Batman" target="_blank">qui</a></h3>  
</div>`

> And here is my CSS code:

.redText {
  color: red;
}
.boldText {
  font-weight: bold;
}

Here is a link to my pen: https://codepen.io/daniele-damico/pen/yjwBGv

Maybe it’s all a bit rough and edgy but, please, understand me: it’s my first project :grinning:


#2

I’ve edited your post for readability. When you enter a code block into the forum, precede it with a line of three backticks and follow it with a line of three backticks to make easier to read. See this post to find the backtick on your keyboard. The “preformatted text” tool in the editor (</>) will also add backticks around text.

Also, there is no need to post the code for your project, since you posted a Codepen link.


#3

Thanks, i was just trying to correct it but thanks to you it’s all good now.


#4

Ciao Daniele,

The page is ok. Image is responsive. I would only add in css:

p {
  padding: 20px;
}

to give the paragraph text some space around the margins.


#5

Need more practice, thats all.

Here is mine : https://codepen.io/sanaullahhafiz/full/OZEGwQ/