HTML和CSS前端教程03-CSS文本样式

bitkylin 发布于2019-04-23 11:52 / 2062人阅读

摘要：目录颜色建议就用十六进制长度的度量单位建议就用文本样式字体属性文本样式颜色建议就用十六进制颜色建议就用十六进制长度的度量单位建议就用长度的度量单位建议就用文本样式文本样式字体的大小，样式以及方位字体属性字体属性属性名说明例子

1.CSS颜色-建议就用十六进制
2.CSS长度的度量单位-建议就用px
3.CSS文本样式
- 3.1. 字体属性
- 3.1. 文本样式

1.CSS颜色-建议就用十六进制

p{
  color: #ff0000
}

2.CSS长度的度量单位-建议就用px

p{
  margin: 0;
  padding: 0;
  font-size: 20px;
  height: 50px;
}

3.CSS文本样式

字体的大小，样式以及方位

3.1. 字体属性

属性名	说明	例子
`font-size`	字体大小	`font-size: 50px`
`font-variant`	英文字体是否转为小型字母	`font-variant: small-caps` `font-variant: normal`
`font-style`	字体倾斜	`font-style: italic` `font-style: normal`
`font-weight`	字体加粗	`font-weight: bold`
`font-family`	font字体	`font-family: 微软雅黑`
`font`	字体样式复合写法	`font: italic bold small-caps 50px 楷体`
`@font-face`	设置Web字体

3.1. 文本样式

属性名	说明	参数
`text-decoration`	z装饰文本出现各种划线	underline：底部线条 overline：头部线 line-through:中间删除线
`text-transform`	大写换成小写	uppercase:转成大写 lowercase：转成小写 capitalize:首字母大写
`text-shadow`	添加阴影	5px(水平偏移),5px(垂直偏移),3px(模糊度),black(颜色)
`text-align`	设置对齐方式	center：居中 left right justify：两端对齐
`white-space`	排版中的空白处理方式	normal: 空白符压缩，文本自动换行 nowrap:空白符压缩，文本不换行 pre:空白符保留，遇到换行符换行 pre-line:空白符压缩，文本排满时换行
`letter-spacing`	设置字母之间的间距	`letter-spacing: 4px`
`word-spacing`	设置单词之间的间距	`letter-spacing: 4px`
`line-height`	设置行高	`line-height: 200%`
`word-wrap`	控制段词,让国产的单词断开	`word-wrap:break-word`
`text-indent`	设置文本首行缩进

专线服务混合云文本样式html html中css样式 html的css样式 html.css教程

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/1275.html

HTML和CSS前端教程03-CSS选择器

摘要：目录定义创建的三种方法元素内嵌权重最高文档内嵌外部引用层叠和继承浏览器样式样式表层叠样式继承选择器选择器的总汇基本选择器复合选择器伪元素选择器伪类选择器定义定义层叠样式表创建的三种方法创建的三种方法元素内嵌权重最高元素内嵌权重最高文档内目录 1. CSS定义 2. 创建CSS的三种方法 2.1. 元素内嵌（权重最高）...

PingCAP 2019-04-23 11:52 评论0 收藏0
CSS开发

摘要：译十六进制颜色揭秘原文地址原文作者译文出自掘金翻译计划本文永久链接教程入门篇关于是一款进行栅格布局的辅助工具，它让开发者摆脱了冗杂的数学计算，同时降低了样式与结构的耦合程度。【译】CSS 十六进制颜色揭秘原文地址：CSS Hex Colors Demystified 原文作者：Dave Gash 译文出自：掘金翻译计划本文永久链接：https://github.com/xitu/...

warkiz 2019-08-30 13:54 评论0 收藏0
前端修炼の道 | 带你走进迷人的 CSS 世界

摘要：每条属性声明实现对网页元素进行某种特定格式的设置，由一个属性和一个值组成，属性和值之间使用冒号连接，不同声明之间用分号分隔，所有属性声明放到一对大括号中。 showImg(https://segmentfault.com/img/bVbkQCI?w=900&h=383); showImg(https://segmentfault.com/img/bVbkQCO?w=900&h=383)...

shiweifu 2019-08-23 13:58 评论0 收藏0
保姆级教程HTML两万字笔记大总结【建议收藏】（上篇）

摘要：标签不区分大小写，但推荐小写。标签可以嵌套，但不能交叉嵌套。标签也称为元素。比如行内标签亦可成行内元素。 ❤️HTML必备知识详解❤️ 第一部分：HTML框架简介...

paulli3 2021-10-13 09:40 评论0 收藏0
JavaScript DOM

摘要：但上述两个情况中都是同一份文档。提示对象是对象的一部分，可通过属性对其进行访问。返回包含指定节点的子节点的集合，该集合为即时更新的集合。对象在中，对象表示元素属性节点的无序集合。 DOM简介（ Document Object Model 文档对象模型） W3C W3C 文档对象模型（DOM）是中立于平台和语言的接口，它允许程序和脚本动态地访问和更新文档的内容、结构和样式。W3C D...

Nekron 2019-08-20 16:38 评论0 收藏0