Inline CSS homework

I have some text with 20 lines

each line i want to decorate with different INLINE CSS
Different properties and values…

(Type a title for your page here)

1. Onthoud dat grote liefde en groot succes, grote risico's met zich brengen.

Wanneer je verliest, verlies dan niet tegelijkertijd de les die je ervan hebt geleerd.

3. Heb respect voor jezelf, respect voor anderen en neem verantwoordelijkheid voor je daden.

  • 4. Onthoud dat niet krijgen wat je wilt soms het beste is wat je kon overkomen.

5. Ken de regels tot in extenso, zodat je weet hoe je ze het beste kunt overtreden.

6. Laat een kleine onenigheid niet een mooie vriendschap verpesten.

7. Wanneer je beseft dat je een fout hebt gemaakt, neem dan onmiddellijk actie om die te herstellen.

8. Neem elke dag tijd voor jezelf.

9. Sta open voor verandering, maar raak je normen en waarden niet kwijt

10. Onthoud dat zwijgen soms het beste antwoord is.
11. Leid een zodanig waardig leven dat wanneer je oud bent en terugkijkt je er opnieuw van kunt genieten.

12. Een liefdesvolle sfeer in je huis legt de basis voor je leven
13. Beperk je in meningsverschillen met geliefden tot het heden : Rakel het verleden nimmer op.
14. Laat mensen delen in je wijsheid.
Het is dé manier om onsterfelijk te worden.

15. Behandel de aarde goed
16. Gá één keer per jaar ergens heen waar je nog nooit bent geweest.
17. Onthoud dat in de beste relatie je meer van elkaar houdt
dan dat je elkaar nódig hebt.
18. Meet de grootte van je succes af aan wat je ervoor hebt moeten opgeven.
19. Benader de liefde en het koken met roekeloze uitbundigheid.
20. Ga lief met elkaar om.

Who can help me

This means using the rather infamous style attribute so that what you will have in the end is twenty examples of what not to do in HTML.

Dutch translated by Google Translate
Dit betekent dat je het nogal beruchte stijl attribuut gebruikt, zodat wat je uiteindelijk hebt twintig voorbeelden zijn van wat je niet in HTML moet doen.

<ol>
<li>
<p style="font-variant: small-caps">Onthoud dat grote liefde en groot succes, 
<span style="font-style: italic">grote risico's met zich brengen</span>.
</p></li>
</ol>

Rendering
inline_style_rendering_1

Remember that great love and great success, entail major risks.

1 Like

Thanks

Did there is any tool what can help me ?

i want 20 different properties and values

Beyond our own knowledge of CSS, not really. Write the lines as <li></li> and insert them into the OL without line numbers. HTML will supply them. Tag the lines any way you wish and insert the style attribute. Avoid styling the LIs by using an inner element like I did above with the <p></p>.

Pick any (now 19) properties from the CSS list and sprinkle as desired.

  • font-size
  • color
  • font-family
  • text-decoration
  • border
  • font-weight

Just thirteen to go…

2 Likes

Thank you very much sir !
I will looking further
Kind regards

1 Like

You’re welcome!

Index of CSS properties

The above will be a helpful reference now and later so be sure to bookmark it in a folder called w3. The entries in green are in the recommendations. They would be the ones to focus upon. At some later time you might wish to come back to the others, just to see if they’ve turned green. Lesson here, don’t use properties that are not in the REC category for web facing pages.

Thank you very much sir !

i also work on it but i am not really happy…

it is still not all INLINE

p.ex1 { border: 1px solid black; outline-style: solid; outline-color: red; } .grid-container { display: grid; grid-template-columns: auto auto auto auto; grid-gap: 50px; background-color: #2196F3; padding: 10px; }

.grid-container > div {
background-color: rgba(255, 255, 255, 0.8);
text-align: center;
padding: 20px 0;
font-size: 30px;
}
table, td, th {
border: 1px solid black;
}

table {
border-collapse: collapse;
width: 100%;
}

th {
text-align: left;
}

(Type a title for your page here)

1. Onthoud dat grote liefde en groot succes, grote risico's met zich brengen.

Wanneer je verliest, verlies dan niet tegelijkertijd de les die je ervan hebt geleerd.

3 Heb respect voor jezelf, respect voor anderen en neem verantwoordelijkheid voor je daden.

4. Onthoud dat niet krijgen wat je wilt soms het beste is wat je kon overkomen.

5. Ken de regels tot in extenso, zodat je weet hoe je ze het beste kunt overtreden.



6. Laat een kleine onenigheid niet een mooie vriendschap verpesten.

7. Wanneer je beseft dat je een fout hebt gemaakt, neem dan onmiddellijk actie om die te herstellen.

8. Neem elke dag tijd voor jezelf.

9. Sta open voor verandering, maar raak je normen en waarden niet kwijt

10. Onthoud dat zwijgen soms het beste antwoord is.
11. Leid een zodanig waardig leven dat wanneer je oud bent en terugkijkt je er opnieuw van kunt genieten.

12. Een liefdesvolle sfeer in je huis legt de basis voor je leven
13. Beperk je in meningsverschillen met geliefden tot het heden : Rakel het verleden nimmer op.
14. Laat mensen delen in je wijsheid.
Het is dé manier om onsterfelijk te worden.

15. Behandel de aarde goed
16. Gá één keer per jaar ergens heen waar je nog nooit bent geweest.
17. Onthoud dat in de beste relatie je meer van elkaar houdt
dan dat je elkaar nódig hebt.
18. Meet de grootte van je succes af aan wat je ervoor hebt moeten opgeven.
19. Benader de liefde en het koken met roekeloze uitbundigheid.
20. Ga lief met elkaar om.

There are three ways to store a style sheet…

  1. external style.css file
  2. embedded <style></style> element in the HEAD
  3. inline style attribute

Your style sheet would be one of the first two. The example given earlier contains inline styles. You need to write all twenty lines as HTML (like recommended, P inside LI in an OL). Use a style attribute on each P element. One could also use DIV, or other block level elements in this exercise.

Thank you very much sir…

I still have many problems, most of them not like to work…

I thought i can use all of them as INLINE CSS but it is hard to find INLINE CSS

Inline CSS is written directly in the tags within the HTML…

<tag style="property: value">Hello World</tag>

Check the example in my earlier post.

hi sir,

i tried the whole day but i couln’t find all 20 differen css inline

This is what i have now

p.ex1 { border: 1px solid black; outline-style: solid; outline-color: red; } .grid-container { display: grid; grid-template-columns: auto auto auto auto; grid-gap: 50px; background-color: #2196F3; padding: 10px; }

.grid-container > div {
background-color: rgba(255, 255, 255, 0.8);
text-align: center;
padding: 20px 0;
font-size: 30px;
}
table, td, th {
border: 1px solid black;
}

table {
border-collapse: collapse;
width: 100%;
}

th {
text-align: left;
}

(Type a title for your page here)

1. Onthoud dat grote liefde en groot succes, grote risico's met zich brengen.

Wanneer je verliest, verlies dan niet tegelijkertijd de les die je ervan hebt geleerd.

3 Heb respect voor jezelf, respect voor anderen en neem verantwoordelijkheid voor je daden.

5. Ken de regels tot in extenso, zodat je weet hoe je ze het beste kunt overtreden.



6. Laat een kleine onenigheid niet een mooie vriendschap verpesten.

7. Wanneer je beseft dat je een fout hebt gemaakt, neem dan onmiddellijk actie om die te herstellen.

8. Neem elke dag tijd voor jezelf.

9. Sta open voor verandering, maar raak je normen en waarden niet kwijt

10. Onthoud dat zwijgen soms het beste antwoord is.
11. Leid een zodanig waardig leven dat wanneer je oud bent en terugkijkt je er opnieuw van kunt genieten.

12. Een liefdesvolle sfeer in je huis legt de basis voor je leven
13. Beperk je in meningsverschillen met geliefden tot het heden : Rakel het verleden nimmer op.
14. Laat mensen delen in je wijsheid.
Het is dé manier om onsterfelijk te worden.

15. Behandel de aarde goed
16. Gá één keer per jaar ergens heen waar je nog nooit bent geweest.
17. Onthoud dat in de beste relatie je meer van elkaar houdt
dan dat je elkaar nódig hebt.
18. Meet de grootte van je succes af aan wat je ervoor hebt moeten opgeven.
19. Benader de liefde en het koken met roekeloze uitbundigheid.
20. Ga lief met elkaar om.

Can you help me to find the last one ?

I appriciate your support

kiind regards

Apparently there is some confusion over the term inline css.