一、文字排版——字体

Eg:

body{font-family:"宋体";}

body{font-family:"Microsoft Yahei";}//微软雅黑

注:

不要设置不常用的字体,如果用户本地电脑上没有安装所设置的字体,就会显示浏览器默认的字体。

二、文字排版——字号、颜色

Eg:

设置网页文字字号12像素,字体颜色设置为#666(灰色):

body{

font-size:12px;

color:#666;

}

三、文字排版——粗体

Eg:

p span{font-weight:bold;}

四、文字排版——斜体

Eg:

p a{font-style:italic;}

五、文字排版——下划线

Eg:

p a{text-decoration:underline;}

六、文字排版——删除线

七、段落排版——缩进

中文文字段前空两个文字的空白。

2em的意思就是文字的2倍大小。

八、段落排版——行间距(行高)

Eg:

p{line-height:1.5em;}

九、段落排版——中文字间距、字母间距

如果想在网页排版中设置文字间隔或者字母间隔就可以使用letter-spacing来实现。

Eg:

h1{

  letter-spacing:50px;

}

注:这个样式使用在英文单词时,是设置字母与字母之间的间距。

单词间距设置(word-spacing):

Eg:

h1{

  word-spacing:50px;

}

十、段落排版——对齐

为块元素中的文本、图片设置居中样式等,可以使用text-align

居中

h1{

  text-align:center;

}

居左

h1{

  text-align:left;

}

居右

h1{

  text-align:right;

}

HTML+CSS基础学习笔记(5)的更多相关文章

  1. HTML&CSS基础学习笔记—创建列表

    创建一张表格 很多时候我们需要在网页上展示一些数据,使用表格可以很好的来展示数据. 在HTML中<table>标签定义 表格. <table> </table> 添 ...

  2. HTML&CSS基础学习笔记1.16-单元格间距和表格主体

    上一篇讲html学习笔记,讲过了合并单元格,那么今天就来介绍下如何控制单元格的间距,以及表格主体的相关知识. 单元格间距 在上个知识点的显示结果中你可能发现了,单元格与单元格之间有一小段空白.这是由& ...

  3. HTML&CSS基础学习笔记1.32-选择器是什么

    选择器是什么 选择器是CSS样式为了定位页面上的任意元素的一种方法. 选择器主要分为:元素标签选择器.通用选择器.类选择器.ID选择器.属性选择器.组合选择器.伪类选择器.伪元素选择器. 先做个了解, ...

  4. HTML&CSS基础学习笔记1.31-像素和相对长度

    像素和相对长度 之前的笔记中,我们提到过用属性width.height来设置图片的尺寸,它们的单元都是”px(像素)”.长度单位总结一下,目前比较常用到px(像素).em.% 百分比,要注意其实这三种 ...

  5. CSS基础学习笔记

    一. CSS介绍 1. CSS概述:CSS(Cascading Style Sheets)指层叠样式表,极大提高了工作效率. 2. 基础语法: 属性大于1个之后,属性之间用分号隔开 如果大于1个单词, ...

  6. HTML&CSS基础学习笔记1.33-元素选择器

    元素选择器 最常见的 CSS 选择器是元素选择器.换句话说,文档的元素就是最基本的选择器: p { text-indent:10px; color:blue; } 什么情况下使用元素选择器,一般我们这 ...

  7. HTML&CSS基础学习笔记1.30-颜色的表达

    颜色的表述 在网页中的颜色设置是非常重要,CSS的属性有字体颜色(color).背景颜色(background-color).边框颜色(border)等,设置颜色的方法也有很多种: 1.英文命令颜色 ...

  8. HTML&CSS基础学习笔记1.29-灵活地使用样式

    灵活的使用样式 使用样式的感觉很棒吧! 刚我们使用的内联样式是给具体的标签加上样式,如果有多个标签的时候,我们用内联样式给标签加样式的时候就需要一个个的加过来,这样就很麻烦. 而如果我们使用内部样式表 ...

  9. HTML&CSS基础学习笔记1.28-给网页添加一个css样式

    CSS是什么? 当HTML配合CSS一起使用时,我们发现页面变得好看了很多.那么CSS到底是什么呢? CSS指层叠样式表 (Cascading Style Sheets),它主要是用于定义HTML标签 ...

  10. HTML&CSS基础学习笔记1.26-input重置表单

    重置表单 <input>的[type]属性值为"button"的时候表示一个普通的按钮,相当于一个<button>标签. <input>的[ty ...

随机推荐

  1. C++的try catch到底能防止什么错误?

    我在.h文件里定义:    LoadingWidget* w;然后.cpp文件里定义: void MyClass::ModifyTask(){    // w = new LoadingWidget( ...

  2. java学习之线程

    一.线程总述: 线程是java当中一个重要的内容,如果想说线程的话,那我们应该先来讲一下什么是进程. 进程:那么什么是进程呢,进程从字面上来理解就是,正在进行的程序.就比如说我们在windows当中打 ...

  3. C++ Prime:const的引用

    可以把引用绑定到const对象上,就像绑定到其他对象上一样,我们称之为对常量的引用.与普通引用不同的是,对常量的引用不能被用作修改它所绑定的对象: ; const int &r1 = ci; ...

  4. C#面向对象——成员变量及封装

    namespace 面向对象5_22 { class Animal { private string _Type; public string Type { get { return _Type; } ...

  5. Codevs_1048_石子归并_(动态规划)

    描述 http://codevs.cn/problem/1048/  1048 石子归并 时间限制: 1 s 空间限制: 128000 KB 题目等级 : 黄金 Gold       题目描述 Des ...

  6. 【转】Xcode7.1环境下上架iOS App到AppStore 流程 (Part 一)

    原文网址:http://www.cnblogs.com/ChinaKingKong/p/4957682.html 前言部分 之前App要上架遇到些问题到网上搜上架教程发现都是一些老的版本的教程 ,目前 ...

  7. 【转】Notepad++插件NppProject发布

    原文网址:http://darkbull.net/article/NppProject/ 如果notepad++安装在 系统盘/program files/ 目录下,可能会提示错误.将npp移到其他目 ...

  8. 进军es6(1)---初识es6

    es6,全称ECMAScript6(又名es2015).何为ECMAScript?我们常说的Javascript和它又有什么联系呢? 阮一峰老师有一句话描述的比较准确:“ECMAScript是Java ...

  9. Parallels Desktop 7用bootcamp安装win7 后如何激活WIN7

    在parallels的选项中,在硬件选项卡的引导标记中添加:kernel.waet.enable=0 ,重新启动win7即可激活.

  10. Good Numbers

    Problem Description If we sum up every digit of a number and the result can be exactly divided by 10 ...