python设置图片透明度_学习python第40天
生活随笔
收集整理的這篇文章主要介紹了
python设置图片透明度_学习python第40天
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
今天是在尚學堂學習python第40天今天學習了CSS 中常用樣式總結,邊框的風格,css中的定位,盒模型,css3中的選擇器,css3中常用的屬性
CSS 中常用樣式總結
字體:(font)
字體的顏色
color: gray;字體的大小
font-size: 12px;字體的加粗
font-weight: bold;字體的風格
font-family: 宋體;字體傾斜
font-style: italic;文本(text)
下劃線展示
text-decoration: underline;去除下劃線
text-decoration: none;文本居中
text-align: center;border 屬性有三個修飾屬性
- border-color
- border-color:red;
- border-top-color:blue;
- border-width
- border-width: 1px;
- border-left-width: 3px;
- border-style
- border-style: solid
- border-bottom-style: solid;
- 可以使用border統一設置
- border: 1px solid red;
- border-right: 5px dotted blue;
行高
line-height: 40px;背景
設置背景圖片
background-image: url("地址");設置背景圖片不重復
background-repeat: no-repeat;調整背景圖片的位置 X Y center居中
background-position: center; background-position: x y;調整背景圖片的大小 寬 高
background-size: 300px 500px背景顏色
四種方法:red
#f0000
rgb(255,0,0)
rgba(255,0,0,.5){包含透明度}background-color: red; background-color: #f0000; background-color: rgb(255,0,0,); background-color: rgba(255,0,0,.5);
行元素和塊元素
行內元素:(多個標簽位于同一行)塊元素:(標簽可以自動換行的元素是塊元素)
行內元素轉塊級元素
display:inline()/block()/none(隱藏)
display: block;float屬性
float屬性指定一個盒子(元素)是否應該浮動。 屬性值值描述left元素向左浮動。right元素向右浮動。none默認值。元素不浮動,并會顯示在其在文本中出現的位置。inherit規定應該從父元素繼承 float 屬性的值。
例如: float:left調整透明度的屬性(范圍0-1)
opacity: 0.4;超出隱藏 hidden
overflow: hidden;列表的風格去除
list-style:none;內邊距
padding-left:15px;邊框的風格
css中的定位
絕對定位:
absolute :定位離開之后釋放的之前的位置 基于外 層父級標簽來說<style>.top_1{width: 200px;height: 200px;background-color: red;position: absolute;top: 300px;left: 300px;}.top_2{width: 200px;height: 200px;background-color: lawngreen;} </style> <body><div class="top_1"></div><div class="top_2"></div> </body>相對定位:
relative: 定位離開之后之前的位置沒有釋放 基于之 前的位置來說<style>.top_1{width: 200px;height: 200px;background-color: red;position: relative;top: 300px;left: 300px;}.top_2{width: 200px;height: 200px;background-color: lawngreen;} </style> <body><div class="top_1"></div><div class="top_2"></div> </body>固定定位:
fixed :始終是基于瀏覽器的左上角定位 適合 做廣告<style>.top_1{width: 200px;height: 200px;background-color: red;position: fixed;top: 300px;left: 300px;}.top_2{width: 200px;height: 200px;background-color: lawngreen;} </style> <body><div class="top_1"></div><div class="top_2"></div> </body>默認定位:
static :初始的定位的操作置于底層位置
z-index:-1(最底層) 置于上一層+1盒模型
內邊距
四周的距離:padding: 50px; 上下的距離 左右的距離:padding: 30px 50px; 上 右 下 左:padding: 10px 20px 30px 40px 單一方向的距離:padding-top: 30px外邊距 (給盒子進行定位)
四周的距離:margin: 50px 上下的距離 左右的距離: margin: 10px 20px; 上 右 下 左: margin: 10px 20px 30px 40px; 單一方向的距離: margin-left/bottom/top/right:30px;外邊距 垂直的方向會取較大的值外邊距 水平方向會合并
清除瀏覽器的留白
body,html{margin: 0px;padding: 0px;}css3中的選擇器
CSS 選擇器參考手冊?www.w3school.com.cncss3中常用的屬性
倒圓角指令
border-radius: 100px;旋轉角度
transform: rotate(45deg);陰影
box-shadow(水平方向的偏移 垂直方向的偏移 模糊度 陰影的顏色)box-shadow: 0px 0px 70px #D5093C;
放大的倍數
transform: scale(1.3);X:水平的位移 Y :垂直的位移 負數:上
transform: translate(0px,-5px);2D角度的旋轉 X Y
transform: skew(40deg,45deg);動畫標簽
調用動畫標簽 animation: 1s ls infinite; 第一種方式 @keyframes name{from{}to{} } 第二種方式 @keyframes name{ 0%{} 50%{} 100%{} }總結
以上是生活随笔為你收集整理的python设置图片透明度_学习python第40天的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: Check Point CEO:“我们正
- 下一篇: python异常处理优点_python各