一系列属性可以改变网页文字的大小和形状,概要如下:
font-family
文字使用的字体,比如宋体,Times New Roman,Arial等等
这个属性必须详细制定,不能使用偏僻的字体,要使用安全字体(比如arial,verdana和times new roman和宋体),可以同时指定许多字体,只要使用逗号分开即可。这样的用意是,如果用户电脑里没有第一个字体浏览器可以使用后面指定的字体。这非常有用,因为不同的电脑拥有不同的字体。例子font-size: arial,helvetica
,pc用户可以使用arial而苹果mac用户可以使用helvetica。
注意:如果字体的名称有许多单词组成,使用双引号组合,比如,font-family: "Times New Romes"。
font-size
字体的大小,要小心使用。比如标题不会和段落一样,它要用大字体,你可以使用h1
h2
等等。
font-weight
这个属性决定字体是否加粗。在实际运用中通常使用font-weight: bold
或font-weight: normal
。理论上还可以使用bolder
,lighter
,100
,200
, 300
, 400
, 500
, 600
, 700
, 800
or 900
,但有些浏览器不认,仍坚持bold
和normal
。
font-style
这个属性决定字体是否是斜体,可能是font-style: italic
或font-style: normal
。
text-decoration
这个属性决定是文本否需要下划线。可以是:
text-decoration: overline
,加上划线
text-decoration: line-through
,加通过文本的线条。
text-decoration:underline
,这应该使用在链接上,因为用户习惯认为它代表链接。
text-transform
改变文本的情况。
text-transform: capitalize
,让每个字的第一个字母大写。
text-transform: uppercase
,所有大写。
text-transform: lowercase
,所有小写。
text-transform: none;
,这个属性不起作用。
css 代码
- body {
- font-family: arial, helvetica, sans-serif;
- font-size: 0.8em;
- }
- h1 {
- font-size: 2em;
- }
- h2 {
- font-size: 1.5em;
- }
- a {
- text-decoration: none;
- }
- strong {
- font-style: italic;
- text-transform: uppercase;
- }
Text spacing
letter-spacing
和word-spacing
属性的意思是字母和文字之间的间隔。值可以是长度或normal
。
line-height
属性设定元素的行高,比如一个段落,没有调准字体的大小。它可以是数字(字体大小的倍数),长度,百分比或normal
。
text-align
设定元素位置,left
,right
,center
或justify
。
text-indent
属性缩进段落的首行。这在打印时经常设置,但网页里通常用不上。
css 代码
- p {
- letter-spacing: 0.5em;
- word-spacing: 2em;
- line-height: 1.5;
- text-align: center;
- }
分享到:
相关推荐
1. `text-align`:用于设置文本对齐,可选值有`left`、`right`、`center`和`justify`。 2. `text-decoration`:定义文本装饰,如`underline`表示下划线,`none`表示无装饰。 这些只是CSS语法和一些基本概念的简要...
在CSS入门阶段,了解以下几个关键概念至关重要: 1. **CSS基本语法**: - CSS选择器:选择器用于匹配HTML或XML文档中的元素,如`h1`、`p`等,或者根据类名、ID等属性进行选择。 - 属性:定义元素的样式属性,如`...
**CSS入门基础经典教程** **一、CSS简介** 在网页设计中,CSS(Cascading Style Sheets)是一种样式表语言,用于描述HTML或XML(包括如SVG、MathML等各种XML方言)文档的呈现。CSS控制了网页元素的布局、颜色、...
### CSS初级教程 1. **应用CSS到HTML中**: - **内联样式**:通过在HTML元素的`style`属性中直接写CSS代码,如`;">文本</p>`。 - **内部样式表**:在HTML文档的`<head>`部分使用`<style>`标签定义样式,这些样式...
初学者可以通过观看CSS入门视频教程来快速上手。这些教程通常会从简单的CSS选择器和属性开始,逐步引导学习者创建基本的样式规则。 **3. CSS语法** - **外部引用CSS**:通过`<link>`标签在HTML文件中引入外部CSS...
《CSS基础教程》是一本适合初学者入门的指导书籍,由ningzhisheng编写,并在JavaEye社区分享。本文将详细解析其中的核心知识点,帮助读者理解CSS的基础概念和应用。 1. **CSS基础与应用** CSS(Cascading Style ...
【CSS入门教程】这篇教程是针对想要学习CSS的初学者准备的,旨在帮助读者快速掌握CSS的基本概念和应用。CSS,全称为级联样式表(Cascading Style Sheets),是用于控制网页元素呈现方式的一种样式表语言。它使得网页...
【CSS入门教程】这篇PDF教程主要面向初学者,旨在教授如何使用CSS进行网页设计。CSS,全称为级联样式表(Cascading Style Sheets),是一种用于控制网页元素外观和布局的语言。通过CSS,设计师可以独立于HTML内容来...
HTML是用来描述网页的一种语言,指的是超文本标记语言(Hyper Text Markup Language),它不是一种编程语言,而是一种标记语言。HTML使用标记标签来描述网页的结构和内容。 标记语言是一套标记标签(mar kup tag)...
CSS3中的`text-shadow`属性就是用来为文本添加阴影效果的,它可以为文字创造出立体感和深度感,使得文本更加引人注目。在CSS2.1中,`text-shadow`就已经被引入,但到了CSS3,该属性得到了进一步的扩展,增加了对不...
CSS 是编程入门人员的必修课,运用CSS样式可以让页面变得美观。 CSS语法由三部分构成:选择器、属性和值: selector {property: value} CSS3 是最新的 CSS 标准。 css3比css多了一些样式设置而已。 css3是向前...
【CSS基础介绍】 ...通过掌握这些基础知识,你可以轻松入门CSS,并为进一步深入学习和提高打下坚实的基础。CSS提供了丰富的样式控制功能,可以实现复杂的布局和动态效果,是现代网页设计不可或缺的一部分。
HTML+CSS+JS入门基础知识点 HTML 是一种超文本标记语言,用于设计网页的主要语言。 HTML 文档的扩展名是 .html 或 .htm,使用记事本或可视化 HTML 编辑器可以编写 HTML 代码。 HTML 文档的结构主要包括和两个...
CSS中可以使用text-align、text-indent、text-decoration、text-transform等属性来设置文本样式。文本对齐方式可以使用left、right、center等,首行缩进可以使用em或px单位,文本修饰可以使用underline、line-...
spacing`(字母间距)、`text-decoration`(文本装饰,如下划线、删除线等)、`vertical-align`(垂直对齐方式)、`text-transform`(文本转换,如大写、小写等)、`text-align`(文本对齐,如左对齐、居中、右对齐...
HTML,全称Hyper Text Markup Language,即超文本标记语言,是网页制作的基础,它与CSS(Cascading Style Sheets)和JavaScript一起构成了网页开发的三大核心技术。HTML是一种标记语言,它由一系列的元素组成,这些...
**标准精悍CSS样式基础教程** CSS,全称Cascading Style Sheets,是一种用于描述HTML或XML(包括如SVG、MathML等各种XML方言)文档样式的样式表语言。本教程旨在帮助初学者深入理解CSS的基础知识,从而实现更具吸引...
2021下半年模考-Web初级理论模-5001卢.doc 本资源摘要信息是关于Web初级理论模考的知识点总结,涵盖了HTML、CSS、JavaScript和相关Web开发技术的基础...21. CSS文本对齐:可以使用text-align属性设置文本的对齐方式。
这个Java教程虽然没有直接涉及Java编程,但它提供了一个Web开发的入门,这对于理解Java Web应用的前端部分非常重要,因为Java后端常常与HTML、CSS和JavaScript紧密集成,通过Servlets、JSP等技术处理用户交互和动态...
以下是一些关于CSS入门的重要知识点: 1. **选择器**: - **元素选择器**:通过元素名来选中页面上的特定元素,如`p`选择所有的段落。 - **Id 选择器**:使用`#id名`来选中具有特定ID的元素,ID在页面中是唯一的...