Ga naar inhoud

Aanpassing stylesheet [CSS]


Rosier

Aanbevolen berichten

Goedenavond. Mijn naam is Jos Rosier, woonachtig in Almere, Nederland. Ik ben net nieuw op dit forum en wil meteen een vraag posten. Ik heb al wel wat ervaring met websites maken in HTML, maar CSS zijn relatief onbekend terrein voor mij.

Ik heb een template gedownload voor een CSS-website die goed te zien is op een SmartPhone of tablet. Nu wil ik in de betreffende stylesheet een lettertype én lettergrootte die exact overeenkomt met wat ik altijd in mijn HTML-codering gebruikte, namelijk >>> font-size : 10px; font-family : Verdana, Helvetica, Arial, sans-serif;

Nu weet ik niet hoe en op welke plekken ik dat in de betreffende stylesheet moet aanpassen. Kan iemand mij daarbij helpen? De stylesheet plak ik hieronder.

Alvast hartelijk dank voor alle hulp, advies & suggesties.

Met groet,

Jos Rosier

-----------------STYLESHEET-------------------------------------------------------------

/*

Original design: Basic Reader (mobile edition) (v2.0 - Sep 11, 2012) - A free xhtml/css website template by Andreas Viklund.

For more information, see Basic Reader

*/

*{margin:0; padding:0;}

body {background:#eee url(background.jpg) top center no-repeat; color:#303030; font:100% Georgia,Times New Roman, serif; line-height:1.5em;}

a {color:#972323; text-decoration:none;}

a:hover {text-decoration:underline;}

p,ul,ol,dl {margin:0 0 20px 0;}

h1 {color:#972323; font-size:3em; line-height:1.1em;}

h1 a {color:#972323; font-weight:400; text-transform:none;}

h2 {font-size:2.0em; color:#2380a0; margin:10px 0 15px;}

h3 {font-size:1.8em; margin:10px 0 15px 0;}

h1,h2,h3 {font-weight:400;}

#wrap {color:#303030; margin:0 auto; padding:10px 0; width:620px; background-color:#f4f4f4;}

#content {clear:both; text-align:left; width:580px; margin:20px 0 30px 20px;}

#sidebar {line-height:1.4em; margin:20px 0 30px 20px; width:580px;border-bottom:3px solid #ccc;}

#sidebar ul {display:block; list-style:none; margin:0 0 20px 0; padding:0 ;}

#sidebar li {list-style:none; float:left; display:inline; margin:0 20px 5px 0; padding:0;}

#sidebar li a {display:block; padding:10px 6px; font-size:1.3em; background-color:#eee; border:2px solid #ddd;}

#sidebar ul ul {line-height:1.2em; margin:8px 0 8px 20px; padding:0;}

#sidebar ul ul li a {font-weight:400;}

#sidebar h2 {display:none;}

#footer {margin:20px auto; width:580px; color:#555; text-align:center;}

#footer a {color:#555; font-weight:400;}

.slogan {color:#777; font-size:1.8em; font-weight:400; margin:10px 0 30px 0;}

.readmore {text-align:right; margin:0 20px 30px 0;}

.timestamp {font-size:1.3em; margin:5px 0 15px 0;}

.timestamp a {font-weight:400;}

.clear {clear:both; height:20px; visibility:hidden;}

Link naar reactie
Delen op andere sites

Hoi,

In html gebruik je waarschijnlijk dan:

<font-size : 10px; font-family : Verdana, Helvetica, Arial, sans-serif;> tekst </font>

in je css zet je bij p,ul,ol,dl {margin:0 0 20px 0;} dit:

p,ul,ol,dl {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 0.8em; color: #000000 }

waar de tekst komt zet dan in plaats van <font> <p> en dus ook sluiten na de tekst met </p> ipv </font>

Link naar reactie
Delen op andere sites

Het is helemaal gelukt, ik heb zelfs de font-size nog iets kleiner gemaakt... 0.7em.

Ik ben helemaal happy, dank je wel. Misschien dat ik nog een keer met wat vraagjes kom, maar ik ga nu eerst de komende tijd verder stoeien.

Thanks, Hollandse groet, Jos Rosier!

Link naar reactie
Delen op andere sites

Gast
Dit topic is nu gesloten voor nieuwe reacties.
×
×
  • Nieuwe aanmaken...

Belangrijke informatie

We hebben cookies geplaatst op je toestel om deze website voor jou beter te kunnen maken. Je kunt de cookie instellingen aanpassen, anders gaan we er van uit dat het goed is om verder te gaan.