前端自学——文本和字体属性

CSS3属性

  1. 常用文本样式属性
    1)color属性:可设置文本内容的前景色,可使用英文单词(不精确)、十六进制(设计软件通用颜色表示法,常见色号:#000(黑色)、#fff(白色))、rgb()、rgba()等表示方法;注:rgba()表示法最后一个表示透明度,介于0~1之间,0表示纯透明,1表示纯实心。
    2)font-size属性:可用于设置字号,单位通常px。(网页文字正文字号通常是16px,浏览器最小支持10px字号)。
    3)font-weight属性:用于设置字体的粗细程度,通常就用normal和bold两个值。
    4)font-style属性:设置字体的倾斜。
    在这里插入图片描述5)text-decoration属性用于设置文本的修饰线外观的(下划线、删除线);
    在这里插入图片描述` h1{
    font-weight:normal; /去掉h1标签的加粗效果/
    }
    p{
    font-weight: bolder; /给p标签加粗/
    }

O泡时间到!

给我O泡给我O泡,O泡果奶OOO!

效果图:
在这里插入图片描述

  1. 字体属性

    1)font-family属性:用于设置字体(通常必须是用户计算机中已经安装好的字体),字体可以是列表形式,一般英语字体放到前面,后面的字体是前面字体的“后备”字体,eg:font-famliy:serif,“Time New Roman”,“微软雅黑”;(字体名称中有空格或为中文,需要使用引号包裹)。
    2)font-variant属性:可以设定小型大写字母。

  2. 段落和行相关属性

    1)text-indent属性:定义首行文本内容之前的缩进量,单位为em(表示字符宽度)。
    2)line-height:定义行高,可以设为以px为单位的数值,或者无单位,直接设置为字号的倍数(也可用百分数表示)。
    3)单行文本垂直居中:设置行高=盒子高度,即可实现;设置text-align:center,即可实现文本水平居中;
    4)font合写属性:可用来作为font-style,font-variant,font-weight,font-size,line-height,font-family属性的合写。
    (eg:font:italic small-caps bold 20px “微软雅黑”,serif;)

<style>
        h3{
            font-family:  "宋体",serif; 
        }
    </style>
</head>
<body>
    <h3>CSS样式表</h3>
    <P style="font-family:'微软雅黑','隶书',serif;">
        CSS目前最新版本为CSS3,是能够真正做到网页表现与内容分离的一种样式设计语言。相对于传统的HTML的表现而言,CSS能够对页中的对象的位置排版进行像素级的精确控制,支持几乎能够进行初步交互设计,是目前基于文本展示最有效的表现设计语言。
    </P>
</body>

效果图:在这里插入图片描述

  1. 继承性
    1)文本相关的属性普遍具有继承性,只需给祖先标签设置,即可在后代所有标签中生效,如:color、font-开头的、list-开头的、text-开头的、line-开头的等。由于文字相关属性具有继承性,所以通常会设置Body标签的字号、颜色、行高等,这样就可以当作这个网页的默认样式了。
    2)在继承情况下,选择器权重计算失效,而是”就近原则“。

参考:慕课网《前端工程师》课程
CSS3样式参考文档

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值