HTML+CSS基础学习笔记(5)
一、文字排版——字体
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)的更多相关文章
- HTML&CSS基础学习笔记—创建列表
创建一张表格 很多时候我们需要在网页上展示一些数据,使用表格可以很好的来展示数据. 在HTML中<table>标签定义 表格. <table> </table> 添 ...
- HTML&CSS基础学习笔记1.16-单元格间距和表格主体
上一篇讲html学习笔记,讲过了合并单元格,那么今天就来介绍下如何控制单元格的间距,以及表格主体的相关知识. 单元格间距 在上个知识点的显示结果中你可能发现了,单元格与单元格之间有一小段空白.这是由& ...
- HTML&CSS基础学习笔记1.32-选择器是什么
选择器是什么 选择器是CSS样式为了定位页面上的任意元素的一种方法. 选择器主要分为:元素标签选择器.通用选择器.类选择器.ID选择器.属性选择器.组合选择器.伪类选择器.伪元素选择器. 先做个了解, ...
- HTML&CSS基础学习笔记1.31-像素和相对长度
像素和相对长度 之前的笔记中,我们提到过用属性width.height来设置图片的尺寸,它们的单元都是”px(像素)”.长度单位总结一下,目前比较常用到px(像素).em.% 百分比,要注意其实这三种 ...
- CSS基础学习笔记
一. CSS介绍 1. CSS概述:CSS(Cascading Style Sheets)指层叠样式表,极大提高了工作效率. 2. 基础语法: 属性大于1个之后,属性之间用分号隔开 如果大于1个单词, ...
- HTML&CSS基础学习笔记1.33-元素选择器
元素选择器 最常见的 CSS 选择器是元素选择器.换句话说,文档的元素就是最基本的选择器: p { text-indent:10px; color:blue; } 什么情况下使用元素选择器,一般我们这 ...
- HTML&CSS基础学习笔记1.30-颜色的表达
颜色的表述 在网页中的颜色设置是非常重要,CSS的属性有字体颜色(color).背景颜色(background-color).边框颜色(border)等,设置颜色的方法也有很多种: 1.英文命令颜色 ...
- HTML&CSS基础学习笔记1.29-灵活地使用样式
灵活的使用样式 使用样式的感觉很棒吧! 刚我们使用的内联样式是给具体的标签加上样式,如果有多个标签的时候,我们用内联样式给标签加样式的时候就需要一个个的加过来,这样就很麻烦. 而如果我们使用内部样式表 ...
- HTML&CSS基础学习笔记1.28-给网页添加一个css样式
CSS是什么? 当HTML配合CSS一起使用时,我们发现页面变得好看了很多.那么CSS到底是什么呢? CSS指层叠样式表 (Cascading Style Sheets),它主要是用于定义HTML标签 ...
- HTML&CSS基础学习笔记1.26-input重置表单
重置表单 <input>的[type]属性值为"button"的时候表示一个普通的按钮,相当于一个<button>标签. <input>的[ty ...
随机推荐
- app:layout_scrollFlags不起作用
http://stackoverflow.com/questions/31722798/enteralwayscollapsed-does-not-bring-back-the-toolbar-whe ...
- 翻译文章“AST 模块:用 Python 修改 Python 代码”---!!注意ironpathyon未实现此功能
https://github.com/upsuper/blog/commit/0214fdd084c4adf2de2ed9912d644fb59ce13a1c +Title: [翻译] AST 模块: ...
- iOS -view横向变成竖向
-------
- insert into select * from 锁表
mysql[192.168.11.187] processid[249] root@localhost in db[zjzc] hold transaction time 197 112069858, ...
- bzoj1016
这道题主要利用了最小生成树的两个性质 最小生成树每种边权的数目固定不变 最小生成树每种边权带来的连通状况一定唯一 由于每种边权的只有不到10种,所以直接穷举然后乘法原理即可 ; type node=r ...
- 远程ubuntu虚拟机Tensorflow搭建 - 1 SSH连接
感谢英才计划,我们每个人收获了一台清华的虚拟机. 4 core CPU 16GB Memory 80GB Disk 配置不错了... 用ssh密钥登录.赠送hadoop-key.pem一把. 先用su ...
- BZOJ2293: 【POJ Challenge】吉他英雄
2293: [POJ Challenge]吉他英雄 Time Limit: 1 Sec Memory Limit: 128 MBSubmit: 80 Solved: 59[Submit][Stat ...
- Flume FileChannel优化(扩展)实践指南
本文系微博运维数据平台(DIP)在Flume方面的优化扩展经验总结,在使用Flume FileChannel的场景下将吞吐率由10M/s~20M/s提升至80M/s~90M/s,分为四个部分进行介绍: ...
- 2D游戏编程6—windows程序模板
// INCLUDES /////////////////////////////////////////////// #define WIN32_LEAN_AND_MEAN // just say ...
- [ZETCODE]wxWidgets教程九:组件专题2
本教程原文链接:http://zetcode.com/gui/wxwidgets/widgetsII/ 翻译:瓶哥 日期:2013年12月15日星期日 邮箱:414236069@qq.com 主页:h ...