• 关于字体


    body { font-family:"华文彩云",“宋体” ,“黑体” ;}

    当引用上面的字体样式的时候,会首选“华文彩云”,如果用户电脑上没有安装该字体则选择“宋体”,如果也没有安装“宋体”,则选择“黑体”。当指定的字体都没有安装的时候,就会选择浏览器默认的字体。

    使用font-family设置字体的时候,需要注意以下几点:

    各种字体之间必须使用英文状态下的逗号隔开。

    中文字体需要加英文状态下的 引号,英文字体一般不需要加引号。当需要设置英文字体的时候,英文字体名字必须位于中文字体名字之前,如下面的代码:

    body { font-family:  Arial , "微软雅黑" ,  "宋体" , "黑体" ;  }      这个是   正确  的书写方式

    body {  font-family:  "微软雅黑" ,  "宋体" , "黑体" , Arial ; }      这个是   错误  的书写方式 

    如果字体中包含   空格    #     $  等符号,则该字体必须加英文状态下单引号 或者 双引号

    如:font-family :"Times New Roman" ;

    尽量使用系统默认的字体,保证在任何用户的浏览器中都能正确的显示。

    @font-face 属性 是CSS3中的新增属性,用于定义服务器字体。通过@font-face属性,用户可以自定义计算机中没有安装的字体,从而使用任何喜欢的字体。基本的语法格式是:

    @font-face {

        font-family:字体名称;

        src : 字体的路径 ;

    }

     在上面的语法格式中,font-family 用于指定该服务器字体的名称,该名称可以随意定义;src 属性用于指定该字体文件的路径。

    <!DOCTYPE html>
    <html lang="en">
       <head>
              <meta charset="UTF-8">
              <title>@font-face属性</title>
              <style>
                         @font-face {
                                   font-family:jianzhi; /* 服务器字体名称*/
                                   src:url(font/FZJZJW.TTF); /* 服务器字体路径*/
                              }
                          p {
                                   font-family: jianzhi; /* 设置字体的样式 ,使用的是服务器上自定义的字体*/
                                   font-size:32px;
                              }

                  </style>
       </head>
       <body>
                  <p>好好好好好</p>
                  <p>好好好好好</p>
       </body>
    </html>

     

     步骤:

     1 . 下载相应的字体,并储存在相对应的服务器的文件夹中;

     2.  使用@font-face属性定义服务器字体;

     3.  对元素应用"font-family" 字体样式

    text-decoration:none/line-through删除线/overline上划线/underline下划线

    text-transform属性用于控制英文字符的大小写。

    text-transform:文本转换:

    none:不转换(默认值);

    capitalize:首字母大写;

    uppercase:全部字符转换为大写;

    lowercase:全部字符转换为小写;

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <title>@font-face属性</title>
    <style>
             .p1 {
                    text-transform: uppercase;
                    text-decoration: line-through;
                }
             .p2 {
                    text-transform: lowercase;
                    text-decoration: underline;
                 }
                .p3 {
                  text-transform: capitalize;
                  text-decoration: overline;
                   }

       </style>
       </head>
       <body>
               <p class='p1'>aaaa</p>
               <p class='p2'>aaaa</p>
                 <p class='p3'>aaaa</p>
       </body>
    </html>

    text-align:center 只能应用于块级元素,如果要对图像img使它居中,可以先用块级元素把它包裹起来,

    text-indent :缩进 属性值可以是不同单位的数值、em字符宽度的倍数,或相对于浏览器窗口的百分比。允许使用负值,建议使用em设置单位 

  • 相关阅读:
    IOS编程之通讯录
    和iPhone有关的视图控制器:UIViewController、UITabBarController、UINavigationController及其混合用法
    跟大家分享下今天所学到的PHP,虽然很基础,但是感觉也很重要
    直接拿来用!最火的iOS开源项目
    ios各种手势,很有意思
    IOS中Json解析的四种方法
    [iOS]深入浅出 iOS 之多线程 NSThread
    IOS应用程序升级
    ios学习笔记之block在ios开发中的应用
    【热门收藏】iOS开发人员必看的精品资料(100个)——下载目录
  • 原文地址:https://www.cnblogs.com/agansj/p/7160522.html
Copyright © 2020-2023  润新知