学前端的第10天

最新推荐文章于 2024-07-03 16:20:00 发布

爱吃江中的江洲

最新推荐文章于 2024-07-03 16:20:00 发布

阅读量62

点赞数

分类专栏：前端

本文链接：https://blog.csdn.net/watermelon1122/article/details/115192451

版权

前端专栏收录该内容

13 篇文章 0 订阅

订阅专栏

一. CSS background-position 属性

background-position属性设置背景图像的起始位置。
菜鸟教程详细讲解！！

二.文本格式

1.颜色

body{color: red;}
h1{color: #00ff00;}
p.ex{color: rgb(0,0,255);}

body里定义的不是背景颜色，而是页面中定义默认的文本颜色选择器。

<h1>标题一</h1>     绿色
<p>背景图片固定</p>  红色
<p class="ex">第二个段落</p>  这是一个类为“ex”的段落，蓝色

2.对齐方式
text-align=""
属性值：center/right/left/justify
justify:每一行被展开为宽度相等，左，右外边距是对齐（如杂志和报纸）。

3.文本修饰
如果使用链接，删除链接的下划线text-decoration="none"
text-decoration=""
属性值：overline/line-throuh/underline：划线设置在上面/穿过字体/字体下面

4.文本转换
可用于所有字句变成大写或小写字母，或每个单词的首字母大写。
text-transform=""
属性值uppercase/lowercase/capitalize：全部大写/全部小写/首字母大写

5.文本缩进
文本第一行的缩进 text-indent:50px

**6.文本阴影
**text-shadow:2px 2px #ff0000
第一个参数：阴影在原本文字的右边多少距离处
第二个参数：阴影在原本文字的下边多少距离处
第三个参数：颜色

7.文本的垂直对齐图像
在这里插入图片描述
vertical-align:text-top;
其他样式

三.字体

字体详细
默认字体大小和普通文本段落一样，是16像素（16px=1em）
使用百分比和em组合
设置 <body>元素的默认字体大小的是百分比：

body {font-size:100%;}
h1 {font-size:2.5em;}
h2 {font-size:1.875em;}
p {font-size:0.875em;}

在所有浏览器中，可以显示相同的文本大小，并允许所有浏览器缩放文本的大小。

font-variant 属性设置小型大写字母的字体显示文本，这意味着所有的小写字母均会被转换为大写，但是所有使用小型大写字体的字母与其余文本相比，其字体尺寸更小。font-variant 属性主要用于定义小型大写字母文本。
属性设置小型大写字母：<font-variant:small-caps;>

补充

<link rel="stylesheet" type="text/css" href="css/index.css">：调用一个外部css文件，它是通过<link>这个标签来调用的，href=""表示外部样式表路径，rel="stylesheet"表示调用的是一种样式，即告诉浏览器你将采用什么编码来对下面的内容进行处理，type="text/css"调用样式的文件类型为css文件