一系列属性可以改变网页文字的大小和形状,概要如下:
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;
- }
分享到:
相关推荐
CSS 是编程入门人员的必修课,运用CSS样式可以让页面变得美观。 CSS语法由三部分构成:选择器、属性和值: selector {property: value} CSS3 是最新的 CSS 标准。 css3比css多了一些样式设置而已。 css3是向前...
#textshadow { text-shadow: 5px 5px 5px #FF0000; font-size:30px; } #wordwrap { width:11em;...CSS3中包含几个新的文本特征。 在本章中您将了解以下文本属性: text-shadow box-shadow text-overflow
1.css的概述 1.问题 HTML属性修饰有一定局限,是不太便捷 2.css的语法规范 1.使用css样式方式 1.内联样式 行内样式 特点:将css样式定义在HTML标记中 语法: 样式声明:用样式属性和值组成(属性:值;) ...
入门如果您尚未安装文本编辑器,请安装文本编辑器-Sublime Text的基本程序包管理器特定语言HTML / CSS必需品 -HTML5代码段/语法生成HTML5 Boilerplate的代码段 -CSS3语法,自动完成HTML预处理器/模板化 - 语法和摘要...
在Twitter,缓冲区和其他一些人上共享选定的文本。 受到启发 我为制作了这个小型javascript库,现有的库无法满足我的需求,因此我创建了一个库。 ShareSelectedText.js当前支持以下社交媒体和服务: 推特 缓冲 ...
文本到语音 Python 入门应用程序 服务使用 IBM 的语音合成功能将英语或西班牙语文本转换为音频信号。 音频以最小的延迟流回客户端。 可以通过 REST 接口访问该服务。 试一试! 单击下面的按钮进入 IBM DevOps ...
文档出处部分Coogle和《原创》,如有雷同纯属巧合 《仅供参考》 首先说明以下内容是本人自己整理(仅供参考!...4) , CSS主要设置于HTML页面中的文本内容(字体,大小,对齐方式等) 5),CSS可以使
基于文本的用户界面CSS库 关于 TuiCss是一个库,旨在像旧的MS-DOS应用程序一样使用基于ASCII表的接口来创建Web应用程序。 这种界面非常合适,因为使用了超对比色,并且减少了视图中组件的使用效果。 该项目的基础是...
超文本标记语言(Hyper Text Markup Language),标准通用标记语言下的一个应用。 HTML 不是一种编程语言,而是一种标记语言 (markup language),是网页制作所必备的。 层叠样式表(英文全称:Cascading Style Sheets)...
入门 访问该项目的以获取文本卡mod的用户指南。 要在本地运行(和修改)Text Card mod,请按照以下步骤操作: 先决条件 这些说明假定您已安装 (包括npm)。 如何开始(使用开发服务器) 在下载/克隆的文本卡mod...
:smiling_face_with_sunglasses:自学JavaScript笔记 格式化字符串-> fstring const myName = 'Vusal'; `My name is ${myName}!`; Output: My Name is Vusal! 十六进制颜色生成器 ...Changes 'hex-color-text' val
│ │ └─SCJP 1_4 认证的初级教程.files │ │ bg-gold.gif │ │ c(1).gif │ │ c.gif │ │ Desktop_.ini │ │ dwcss.js │ │ dwlogo-small.gif │ │ emailfriend2.js │ │ forumwindow.js │ │ grabtitle...
HTML 表示超文本标记语言(Hyper Text Markup Language)。 HTML 文件是一个包含标记的文本文件。 这些标记保速浏览器怎样显示这个页面。 HTML 文件必须有htm 或者html 扩展名。 HTML 文件...
超文本 :也是文本,但会具备特殊功能 普通文本 a : 普通字符 a 超文本 a : 表示超链接 普通文本 b : 普通字符 b 超文本 b : 加粗显示文本 标记 :超文本的表现形式 普通文本 a : a 超文本 a : <a></a> ...
│ │ └─SCJP 1_4 认证的初级教程.files │ │ bg-gold.gif │ │ c(1).gif │ │ c.gif │ │ Desktop_.ini │ │ dwcss.js │ │ dwlogo-small.gif │ │ emailfriend2.js │ │ forumwindow.js │ │ grabtitle...
│ │ └─SCJP 1_4 认证的初级教程.files │ │ bg-gold.gif │ │ c(1).gif │ │ c.gif │ │ Desktop_.ini │ │ dwcss.js │ │ dwlogo-small.gif │ │ emailfriend2.js │ │ forumwindow.js │ │ grabtitle...
│ │ └─SCJP 1_4 认证的初级教程.files │ │ bg-gold.gif │ │ c(1).gif │ │ c.gif │ │ Desktop_.ini │ │ dwcss.js │ │ dwlogo-small.gif │ │ emailfriend2.js │ │ forumwindow.js │ │ grabtitle...
│ │ └─SCJP 1_4 认证的初级教程.files │ │ bg-gold.gif │ │ c(1).gif │ │ c.gif │ │ Desktop_.ini │ │ dwcss.js │ │ dwlogo-small.gif │ │ emailfriend2.js │ │ forumwindow.js │ │ grabtitle...
从图像中提取文本 入门 创建virtualenv # create env conda create --name textman # activate it conda activate textman 安装依赖 pip install -r requirements.text 运行应用 uvicorn app:app --reload ...