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 ...
随机推荐
- Maven学习:常用mvn命令
转自:http://blog.csdn.net/lfsfxy9/article/details/12200915 Maven 在线: <span style="font-family: ...
- <转>如何将Chrome变成开发利器,开发者们在用这些插件
Chrome 浏览器具有强大的跨平台能力以及丰富的扩展插件,一直是许多开发者的首要选择.而利用许多 Chrome 插件,开发者们在开发流程中能够极大地提高开发效率.我们就整理了十款开发者常用的 Chr ...
- Reward
Reward Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)Total Subm ...
- Ignatius and the Princess III
Ignatius and the Princess III Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K ...
- ftp服务器测试
前台传递字符串reqbuf: ftp服务器IP\r\n端口\r\n用户名\r\n密码\r\nftp路径\r\n\r\n 解析reqbuf,重新组装成系统命令,去执行ftptest.sh脚本, 调用sy ...
- linux时间设置相关
1.查询时间命令:date 2.设置日期:date -s mm/dd/yyyy 3.设置时间:date -s HH:MM:SS 4.将当前时间及日期写入BIOS,避免重启失效:hwclock -w 5 ...
- Android SeekBar 和 draw9patch 的使用
今天要使用一个SeekBar控件,其实我觉得Android默认样式已经很不错了,无奈设计不同意,而且SeekBar左右两边也有图片,默认样式和图片也确实不协调,因此这里使用图片自定义SeekBar样式 ...
- linux 多线程基础1
一.什么是线程 在一个程序里的多个执行路线就叫做线程.更准确的定义是:线程是“一个进程内部的一个控制序列”. 典型的unix进程可以看成只有一个控制线程:一个进程在同一时刻只做一件事情. ...
- 一次服务器CPU占用率高的定位分析
现象: 当前项目启动一段时间,有一个服务导致CPU使用率持续超过30% 环境:Windows 7, CPU: 8核, 内存: 8g内存 定位过程: 启动项目,查看Java进程ID 查看Event P ...
- clas