CSS的进一步深入（更新中···）

Half 发布于2019-04-23 13:23 / 3139人阅读

摘要：在之前我们学了种选择器和三种样式的引入，学习选择器就是为了更好的选择文本，学习的引入是为了使文本增加各种样式和属性，下面我们简单来学习一下为文本加样式和一些属性和属性值文本的样式颜色文本对齐方式文本修饰宋体什么都没有宋体是上划线

在之前我们学了6种选择器和三种CSS样式的引入，学习选择器就是为了更好的选择文本，学习CSS的引入是为了使文本增加各种样式和属性，

下面我们简单来学习一下为文本加样式和一些属性和属性值：

1.文本的样式 text

（1）颜色 color：red/blue/pink/···；

（2）文本对齐方式 text-align:left/center/right/justify;

（3）文本修饰 text-decoration:none/overline/underline/line-through;(none 什么都没有 overline 是上划线 line-through 删除线 underline下划线)

(4)文本缩进 text-indent:20px;

2.字体 font

（1）大小 font-size:20px;

（2）颜色 color:red; （注：不能写成font-color:red;因为是错的)

（3）形状 font-style:normal/italic/oblique/indherit;(怕你们不懂，给你们找来张解释图）

（4）字形 font-family:"微软雅黑";

（5）加粗 font-weight:bold;后面也能跟数字

400是正常比400大是加粗比400小是变细不带px

3.背景 background

（1）背景颜色 background-color:red;可以简写成background:red;

（2）背景图片 background-image:url("路径");可以简写成background:url();

（3）背景平铺 background-repeat:no-repeat/repeat-x/repeat-y;

1.平铺浏览器默认就平铺；

　　 2.不平铺 no-repeat；

　　 3.平铺x轴或y轴 background-repeat:repeat-x/repeat-y;

（4）背景大小

background-size:100% 100%; （第一个100%是x轴上的值，第二个100%是y轴上的值）

background-size：属性值；有哪些写法？

可以设置具体的数字大小 200px 200px；也可设置成 auto 自适应（一般做属性值）i

（普及：body是自适应的高，不是固定值，所以给body设置背景大小时，要留心height，也就是高度的问题）

（5）背景位置 background-position:100px 100px;

background-position：属性值；也是坐标轴向下为正向右为正数

有哪些写法？

也可以设置具体的数字大小，如：100px 100px；

还可以写成百分比，如50% 50%就是居中，还可以写成英文单词（top/left/right/bottom/center)，如:left left就是左上角

背景简写：

（注：背景大小不能简写）

4.边框 border

（1）边框颜色 brider-color: red;

（2）边框粗细 border-width: 1px;

（3）边框样式 border-style;soild/dashed;（实线/虚线）

（4）边框圆角 border-radius:50%;（属性值是具体的数字或百分比）

边框简写：

　　边框圆角 border-radius 后面的值是具体的数字或百分比

（注：边框圆角不能简写）

GPU云服务器云服务器 cdn183 183是移动还是联通 php中css的用法更新中

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

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

css的再深入6（更新中&#183;&#183;&#183;）

摘要：宋体雪碧图宋体我们的宋体和宋体中有三个属性可以向服务器发送请求，宋体。宋体类型，客户端和服务器之间的暗号，根据拓展名而定。注内容包含图片和文字 background-position 雪碧图我们的html和css中有三个属性可以向服务器发送请求，src href url。 overflow 　　(1) 值hidden 超出就隐藏　　(2) 值scroll 出现滚动条　　vis...

Bowman_han 2019-04-23 13:19 评论0 收藏0
css的再深入7（更新中&#183;&#183;&#183;）

摘要：宋体可以继承的属性有哪些宋体系列宋体系列宋体的值的问题宋体四个值的顺序是宋体左上宋体右上宋体右下宋体左下。宋体在宋体下宋体为负让元素居中，前提是知道元素的宽高。宋体如宋体正常状态宋体宋体设值时1.transparent 透明的 2.placeholder 提示语写页面搞清结构层次，保证模块化，让他们之间不能受到影响 (1)元素性质 (2)标准流浮动带来的脱离文档流撑不起父级的高度...

番茄西红柿 2019-04-23 13:18 评论0 收藏0
css的再深入9（更新中&#183;&#183;&#183;）

摘要：宋体二宋体浏览器浏览器和浏览器之间是由差距的，这个差距是由浏览器自身的内核决定的。宋体每个浏览器都有自己的前缀，主要解决宋体中的兼容问题。宋体是弹性子元素在弹性容器中所占的份数。一单位 1.px 就是一个基本的单位像素 2.em 也是一个单位用父级元素的字体大小乘以em前面的数字。如果父级没有就继承上一个父级直到body，如果body没有那就默认是16px。 3.rem 也是一个单位，...

yexiaobai 2019-04-23 13:18 评论0 收藏0
CSS的再深入2（更新中&#183;&#183;&#183;）

摘要：层叠行选不中的情况下，走继承性。继承性的权重为。选中情况下，首先需要考虑权重的问题，谁的权重大，就选谁的样式属性。如果权重相同，因为后者会覆盖前者，所以谁的样式属性在后面，就选择谁的样式属性。在上一章中，我们又引出了一个知识点： margin的问题 margin：0 auto；（上下为0，左右自适应）会解决元素的居中问题（auto 自适应）前提是给这个元素设置width 同时，我们又要学习新...

enrecul101 2019-04-23 13:20 评论0 收藏0
CSS的再深入3（更新中&#183;&#183;&#183;）

摘要：而第一个依然存在，所以就会叠加。宋体行级加只要加了，这个元素就会脱离标准文档流行级元素加了，脱离了标准文档流，会变得块不像块，行不像行，能设置快高，能并排排列，则也不用给行级标签加了，没有意义。在前面，我们学习了标准文档流，但在实际制作的过程中，用标准文档流书写显然是不现实的，因此，我们来了解几种脱离标准文档流的方法： 1.float 浮动 float：left/right；（左浮/右浮） ...

RayKr 2019-04-23 13:19 评论0 收藏0