如何更改在typo3 8.7 中创建的表单的字体？

Question

Im absolutely new to typo3 and want to set up a simple contact form. So I created a form and added it to the page. My template record looks like this:

page = PAGE
page.typeNum = 0
page.10 < styles.content.get
page.includeCSS {
  file1 = fileadmin/templates/css/style.css
}

I can see the form and it works appropriately, but unfortunately my css doesnt do anything.

My style.css looks like this:

p {
    font-family: arial;
    font-size: 120px;
}

Gotta admit i have no knowledge about CSS too. The changes I made had absolutely no impact on my page. Do these infos help you by any chance? I just have no idea how to fix it on my own, been searching for a solution all day long.

Answer 1

you should learn more about the structure of CSS-files. maybe you inspect some with your browser from other sites.

Then you will notice it is something like:

p {
    font-family: arial; 
}

---

For file pathes in typoscript or objects and attributes: don't insert spaces:

:
page.10 < styles.content.get
page.includeCSS {
    file1 = fileadmin/templates/css/style.css
}

Answer 2

Your style.css should only contain this:

p {
  font-family: arial;
  font-size: 120px;
}

... and you'll see the difference ;)

Probably only a copy&paste error, but your TypoScript (aka template record) has spaces where it shouldn't:

...
file1 = fileadmin/templates/css/style.css
...

Answer 3

120px will result in a really big font ;-)

Set the style-definition to the body-tag (so for all elements below the body), not only for the p.

body {
  font-family: Arial, sans-serif;
  font-size: 12px;
}

Answer 4

You should define the styling of the input fields seperately. With some browsers the inheritance from the body tag definitions seem not to work.

input, textarea { font-size:1.25em; font-family:serif; border:1px solid darkgray; }

Something like that.