zoukankan      html  css  js  c++  java
  • 第十章:为文本添加样式

    本章内容:

    1.选择字体的方法:在样式表中需要的选择器之后输入font-family:name。如:要将body元素的字体换成Geneva的代码:body{font-family:geneva;}。需要注意的是:虽然font-family属性是继承的,但是有几个元素不会继承父元素的字体设置,其中有表单的select、textarea、input 元素。但是可以强制它们继承父元素的字体设置,代码为:input,select,textarea{font-family:inherit;}

    2.指定替代字体:字体列表成为字体栈,通常包括三个字体:希望使用的字体、一个或几个替代的字体、一个表示类属的标准字体。每个字体之间用逗号隔开。如:body{font-family:Geneva,Tahoma,sans-serif;}

    3.创建斜体:font-style:italic(创建斜体)或oblique(创建倾斜文本)。注意:取消斜体是:font-style:normal。font-style属性时继承的。

    4.应用粗体格式:输入:font-weight:blod 让文本显示为具有平均粗直的粗体。或者输入100~900之间100的倍数,400表示正常粗细,700代表粗体。再或者输入:bloder(更粗)或lighter(更细)。取消粗体格式:font-weight:normal。font-weight属性时继承的。

    5.设置字体大小:(1)直接使用像素指定要使用的特殊字号。(2)用百分数、em或者rem指定相对于父元素文本的大小。使用em与百分比数的算法:要指定的字体的大小/父元素的字体大小=值。如:输入:font-size:字体大小值。

    6.设置行高:行高指的是段落的行距,即段落内之间的距离。输入:line-height:n。这里的n是一个数字,它与元素的字体大小相乘,得出需要的行高。

    7.设置字体颜色:输入:color:colorname。

    8.设置背景:修改文本的背景颜色:background-color:colorname(颜色名称)或transparent(表示允许透过父元素的背景颜色)。使用背景图像作为背景:background-image:url(或者none表示不使用图像)。重复背景图像:输入:background-repeat:direction,这里的direction可以取四个值:repeat、repeat-x、repeat-y、no-repeat。控制背景图像是否随页面滚动:background-attachment:fixed(背景图像会附着在浏览器的窗口上)/scroll(访问者滚动页面时背景图像会移动)/local(只有访问者滚动背景图像所在的元素时,背景图像才会移动)。指定元素背景图像的位置:background-position_x y_,其中x和y可以表示为距离左上角的绝对距离或百分数。

    9.控制间距:指定字间距:word-spacing:length这里的length是一个带单位的数字,如0.4em或5px。指定子偶间距:letter-spacing:length,这里的length是一个带单位的数字,如0.4em或5px。

    10.添加缩进:text-indent:length 这里的length是一个带单位的数字,如1.5em或18px。

    11.对其文本:输入:text-align:left(左对齐)/right(右对齐)/center(居中)。

    12.修改文本的大小写:text-transform属性可以为样式定义文本的大小写。text-transform:capitalize让每个单词的首字母大写,text-transform:uppercase让所有字母大写,text-lowercase让所有字母小写,text-transform:none让文本保持原来的样子。

    13.装饰文本:text-decoration:underline以添加下划线,或者输入overline以添加上划线,或者输入line-through以添加删除线。

    14.设置空白属性:white-space:pre(让浏览器显示原文本中的所有空格和回车)、nowrap(确保所有空格不断行)、normal(按正常方式处理空格)。

  • 相关阅读:
    Spring框架中的aop操作之二 通过配置文件实现增强
    计算机应用第八次作业
    计算机应用第七次作业 html制作个人音乐播放站点
    有一个3*4的矩阵,编程求出其中最大值,以及其所在的行号和列号。
    Spring框架中的aop操作之一 及aspectjweaver.jar与aopalliance-1.0.jar下载地址 包含beans 注解context 和aop的约束
    Spring框架 aop中的操作术语
    Spring中aop原理
    Spring框架 全注解annotation不使用配置文件(SpringConfiguration.java类代替) 补充 xml配置文件没有提示解决
    Dev-Cpp 5.11 c++编译器下载
    大人虎变,小人革面,君子豹变
  • 原文地址:https://www.cnblogs.com/koto/p/5008612.html
Copyright © 2011-2022 走看看