1949啦网--小小 痛苦,是因为能力和欲望不匹配造成的

CSS3的rgba()背景颜色透明度和字体单位px、rem、vw还有字体的设置

CSS3 rgba用法

CSS 中的颜色有三种定义方式:使用颜色方法(RGB、RGBA、HSL、HSLA),十六进制颜色值和预定义的颜色名称。

      RGBA 是代表Red(红色) Green(绿色) Blue(蓝色)和 Alpha(不透明度)三个单词的缩写。RGBA 颜色值是 RGB 颜色值的扩展,带有一个 alpha 通道 - 它规定了对象的不透明度。

基本语法:

  R:红色值。正整数 (0~255)

  G:绿色值。正整数 (0~255)

  B:蓝色值。正整数(0~255)

  A:透明度。取值0~1之间

二、字体单位

1、rem是相对于根元素<html>,这样就意味着,我们只需要在根元素确定一个参考值即可。

2、10vw相对于屏幕大小百分之10%

<!DOCTYPE html>  <html>  	<head>  		<meta charset="UTF-8">  		<title></title>     <style type="text/css">      	#hd{      		width: 600px;      		height: 400px;      		font-size: 40px;      		font-weight: 700;      		color: white;      		/*background: purple;*/      		/*不透明*/      	/*	opacity: 0.7;*/      	/*后面的0.6是调背景颜色透明度的*/      	background: rgba(128,0,128,0.6);      	}      /*-----------------------------------------------------------------------*/      /*rem是相对于根元素<html>,这样就意味着,我们只需要在根元素确定一个参考值即可。*/      /*html{      	font-size: 20px;      }*/      /*h1{      	font-size: 1.5rem;  是根html字体的1.5倍      }*/      /*p{      	font-size: 0.8rem;      }*/      /*--------------------------------------------------------------*/      /*10vw相对于屏幕大小百分之10% */      p{      	font-size: 10vw;      }      #kjrt p{      	width: 400px;      	height: 300px;      	border: 3px solid blue;      	font-size: 16px;      	overflow: hidden;      	/*强制不换行*/      	white-space: nowrap;      	/*clip 修剪文本   ellipsis 显示省略符号来代表被修剪的文本         string使用给定的字符串来代表被修剪的文本*/      	text-overflow:ellipsis;      }      /*---------------------------------------------------------*/      span{      	/*第一个是水平阴影的位置(10px就是阴影往右移10px;   -10px就是往左移),第二个是阴影垂直位置   第三个是模糊距离  第四个是阴影的颜色*/      	text-shadow: 10px 0 10px purple;      }      /*------------------------------------------------------*/      #jretj{      	width: 500px;      	height: 300px;      	background: blue;      	margin: 100px auto;      	/*第一个第二个第三个和上面的意思相同,第四个是阴影的尺寸(实心的)      第五个是阴影的颜色也是和上面的意思相同*/      	box-shadow: 0px 0px 0px 30px red;      }      </style>      </head>      <body>      <div id="hd"> 03 rgba 字体单位</div>      <h1>03 rgba 字体单位</h1>      <p>03 rgba 字体单位</p>      <div id="kjrt">      <p>  “其实没什么可说的,最简单与朴素的道理皆蕴含在平凡的事物中。古树折断,也许会死,因为生机早竭。如那韭菜,初种下时发黄且细弱,可是一茬又一茬的割过,却会愈发浓绿,逐渐粗壮。也如那蚕,若困于茧中,自会憋死、灭亡,可若是破茧而出,就会化成蝶,鲜艳亮丽,这是一次涅槃,超脱过去。”      柳神平静道来,波澜不惊,述说着在平常不过的事。      小不点的大眼则越发的明亮,看着它焦黑的树干,以及仅余的一根嫩绿的枝条,道:“也如柳神,于毁灭中焕发生机,将来会更强,这是一种磨砺,也是一场与众不同的修行,涅槃后必将远超过去。”      “你的悟性很好,但我的情况……你就不要乱联想了。”柳树传音,竟带着淡淡的笑意,难得有了情绪波动。      “柳神是你救了我吗?”小不点像是想起了什么,当初他是那么的虚弱,身体发生了严重的退化,差点都要死掉了。      山风吹来,那根绿莹莹的枝条拂动,柳树传音,道:“我如果给予你生机,你也只是活下来而已,将平凡的度过此生,起初我只是静静的看着。”      “我自己活下来的?”小不点讶然。</p>      </div>      <span>“小不点这里就是你的家,不管你是否知道了身世,我们也都是你的亲人。”一群中年女子说道。      而一群大老爷们则伸出粗糙的大手,揉了揉他的头,裂开大嘴笑道:“没什么大不了,我们石村连神明都诞生过,将来你必然是可与太古凶禽——金翅大鹏一战的强者,要知道,那可是能屠神的存在。”      “小不点不要哭,还有我们呢,我们是一起长大的好兄弟,将来有什么一起扛!”一群孩子也叫道。      “嗯!”小不点擦干了脸上的泪水,用力点了点头,族人对他很好,让他快乐长大,很开心,他的童年并没有被仇恨充斥。      当然,将来他必然要去那古国走上一趟,要去讨个说法!      “爷爷,我要变强!”小不点从来没有像今天这般渴望力量,然而他在石村的修行到了顶点,没有什么可学的了。      而那个古国,统驭亿万里山河,无比广袤,人口亿万万,多的难以想象,必然是天才辈出,代代有人杰惊世。</span>      <div id="jretj">      </div>      </body>      </html>

原文链接:https://www.qiquanji.com/post/7127.html

本站声明:网站内容来源于网络,如有侵权,请联系我们,我们将及时处理。

微信扫码关注

更新实时通知

作者:xialibing 分类:网页教程 浏览: