css font¿ØÖÆ×ÖÌåµÄ¶àÖֱ任
½Ì³ÌÒý¼ö£ºcssÊÓƵ½Ì³Ì
CSS×ÖÌåÊôÐÔ¶¨ÒåÎı¾µÄ×ÖÌåϵÁС¢´óС¡¢¼Ó´Ö¡¢·ç¸ñ£¨ÈçÍáÌ壩ºÍ±äÐΣ¨ÈçСÐÍ´óд×Öĸ£©font-family²Ù×Ý×ÖÌ壬ÓÉÓÚ¸÷¸öµçÄÔϵͳ°²ÖõÄ×ÖÌå²»¾¡À×ͬ£¬µ«ÊǸù±¾×°ÓкÚÌå¡¢ËÎÌåÓë΢ÈíÑźÚÕâÈý¿î×ÖÌå¡£
font-size
²Ù×Ý×ÖÌå´óС£¬ÎÒÃÇÉ趨×ÖÌå´óСÊÇÉ趨ËüµÄ¿í¶È£¬ËüµÄ¸ß¶ÈÒ»ÑùµçÄÔϵͳĬÐí×ÖÌå´óСÊÇ16px£¬ËùÒÔ×ÖÌå´óС¾¡Á¿²»ÒªµÍÓÚ16px£¬1em=16px£»
font-weight: bold;
/*²Ù×Ý×ÖÖØ Ò»ÑùÊÇ100-900 ³£ÓÃlighter(ϸÌå) normal£¨Õý³££©bold¼Ó´Ö */
ÖÁÓÚÕâ¸öfont-style
£¬Ò»ÑùĬÐíÊÇnormal£¬Ò²¾ÍÊÇÕý³£µÄ£¬¼ÙÈç˵ÄãÉ趨 font-style: italic;ÍáÌå»°£¬ÆäʵºÍÕâ¸ö<em></em>µÄ½á¹ûÊDz¶àµÄ;ÎÄ×Ö¼äµÄ¼ä¾àÓõÄline-height¼ÙÈçºÍ¸ß¶ÈÏàµÈ»°£¬¾ÍÊÇ´¹Ö±¾ÓÖÐÁË¡£
ƽ³£font×ÖÌåµÄ¼òд:font:style weight size/line-heigt font-family /*ÒªÇó±ØÐèÏÔÏÖµÄ2¸öÊÇ sizeÓëfont-family*/
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>css³£ÓÃÑùʽfont×ÖÌåµÄ¶àÖֱ任</title> <style> div{ font-family: 'Microsoft YaHei';/*΢ÈíÑźÚ*/ /* font-family: 'Lucida Sans','Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif; */ /*×ÖÌå¼ÓÉÏË«ÒýºÅ»òÕßµ¥ÒýºÅ£¬µ±Óжà¸ö×ÖÌåµÄʱºò£¬ÖÐÐĶººÅ·Ö¿ª*/ color:#f90; font-size: 24px;/*²Ù×Ý×ÖÌå´óС*/ font-weight: bold; /*²Ù×Ý×ÖÖØ ³£ÓÃlighter(ϸÌå) normal£¨Õý³££©bold¼Ó´Ö */ font-style: italic;/*µÈͬÓÚem*/ line-height: 30px; } /*font×ÖÌåµÄ¼òд:font:style weight size/line-heigt font-family*/ /*ÒªÇó±ØÐèÏÔÏÖµÄ2¸öÊÇ size font-family*/ p{ font: 24px/1.5em 'Lucida Sans','Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif; letter-spacing: 1px;/*Ó¢ÎÄ×Öĸ¼ä¾à*/ word-spacing: 10px;/*Ó¢Îĵ¥´Ê¼ä¾à*/ } P::first-letter{ text-transform: capitalize; }/*µÚÒ»¸ö×Öĸ::first-letter*/ p::first-line{ color:red; }/*µÚÒ»ÐÐ::first-line*/ </style> </head> <body> <div>¼¼ÊõΪÍõÊÀ½ç,ÓûÎʱ˲Ôɽ¶¥·ç¹â¿É·ñ¶ÀºÃ¼¼ÊõΪÍõÊÀ½ç, ÓûÎʱ˲Ôɽ¶¥·ç¹â¿É·ñ¶ÀºÃ¼¼ÊõΪÍõÊÀ½ç,ÓûÎʱ˲Ôɽ¶¥·ç¹â¿É·ñ¶ÀºÃ¼¼ÊõΪÍõÊÀ½ç, ÓûÎʱ˲Ôɽ¶¥·ç¹â¿É·ñ¶ÀºÃ¼¼ÊõΪÍõÊÀ½ç,ÓûÎʱ˲Ôɽ¶¥·ç¹â¿É·ñ¶ÀºÃ¼¼ÊõΪÍõÊÀ½ç, ÓûÎʱ˲Ôɽ¶¥·ç¹â¿É·ñ¶ÀºÃ¼¼ÊõΪÍõÊÀ½ç, ÓûÎʱ˲Ôɽ¶¥·ç¹â¿É·ñ¶ÀºÃ¼¼ÊõΪÍõÊÀ½ç,ÓûÎʱ˲Ôɽ¶¥·ç¹â¿É·ñ¶ÀºÃ </div> <p>Technology is king world, I want to ask if the scenery on the top of Qingtian Mountain is the king of technology, I want to ask whether the scenery of Qingtian Peak is the king of technology. If the technology is the king of the world, I would like to ask whether the scenery on the top of Qingtian Mountain is the king of the world. Is the scenery good?</p> </body> </html>
¹ØÓÚÑùʽ¼Ì³ÐÎÊÌâ/*ÓëÎÄ×ÖÓйØÑùʽ»á±»¼Ì³ÐÏÂÈ¥*/´úÂëÕ¹ÏÖÈçÏ£º
<!doctype html> <html> <head> <meta charset="UTF-8"> <title>index</title> <style> p{ font-size: 20px; font-family: ΢ÈíÑźÚ; color:#f00; font-weight:bold; font-style:italic; word-spacing:15px; } </style> </head> <body> <div> <p><span>linux php linux</span></p> <p><span>linux linux php linux</span></p> <p><span>linux linux php linux</span></p> <p><span>linux linux php linux</span></p> </div> </body> </html>
¸ÐлÄúµÄÖ§³Ö£¬ÎÒ»á¼ÌÐøŬÁ¦µÄ!
´ò¿ªÖ§¸¶±¦É¨Ò»É¨£¬¼´¿É½øÐÐɨÂë´òÉÍŶ
°Ù·Ö°ÙÔ´ÂëÍø ½¨Òé´òÉÍ1¡«10Ôª£¬ÍÁºÀËæÒ⣬¸ÐлÄúµÄÔĶÁ£¡