当前栏目: [前端开发基础]您现在的位置是:成都seo > 前端学习 > 前端开发基础 > 正文

HTML基础学习第九天

2020-04-09 23:55前端开发基础 人已围观文章来源:成都SEO文章作者:小成站长

简介1.背景颜色半透明 background: rgba(); 背景总结 属性 作用 值 background-color : 背景颜色 RGB,十六进制 background-iamge; 背景图...

1.背景颜色半透明
 
background: rgba();
 
背景总结
 
属性 作用
background-color : 背景颜色 RGB,十六进制
 
background-iamge; 背景图片 url(图片路径)、
 
background-reapeat 是否平铺 repeat/no-repeat/repeat-x/repeat-y
 
background-position 背景位置 length/position 分别是x 和 y坐标
 
background-atachment 背景附着 scroll(背景滚动)/fixed(背景固定)
 
背景简写 书写更简单 背景颜色 背景图片 背景平铺 背景滚动 背景位置;
 
背景半透明 背景颜色半透明 background:rgba(0,0,0,0.3);
 
--------------------------------------
 
CSS的三大特性
 
CSS三个非常重要的三个特征:层叠性,继承性,优先级。
 
层叠性原则:
样式冲突,遵循的原则就是就近原则。
 
div {
color: red;
}
 
div{
color: green;
}
最终效果 red;
---------------------------------------------
继承性:
 
CSS中的继承: 子标签继承父标签属性
 
子元素可以继承父元素的文本样式(text,font-,line-,color)
 
-------------------------------------------------------
行高的继承
 
body {
font:12px/1.5 Microsoft YaHei;
}
 
1.行高可以不跟单位
2.如果子元素没有设置行高,则会继承父元素的行高为1.5
3.此时子元素的行高是:当前子元素的文字大小 *1.5
 
body行高1.5这样写法最大优势,子元素可以根据文字大小调整 行高
 
---------------------------------------------------
优先级
 
选择器权重
继承 和 * 0,0,0,0
 
元素选择器 0,0,0,1
 
类选择器,伪类选择器 0,0,1,0
 
ID选择器 0,1,0,0
 
行内样式 stle="" 1,0,0,0
 
!important 无穷大
 
 
优先级权重由 4组数字组成, 但是不会有进位
 
继承的权重是0,不管父元素的权重有多大,子元素继承权重都是0。
 
-----------------------------------------
权重叠加
 
复合选择器会有权重叠加问题
 
权重虽然会叠加,但永远不会进位
 
元素标签 权重 1
类,伪类选择器 权重 10
ID选择器 权重 100
行内选择器 权重 1000
!important 权重 无穷大
 
--------------------------------------------
 
CSS盒子模型
 
盒子模型 浮动 定位
 
 
1.盒子模型
 
边框;border
内容;content
内边距;padding
外边距;margin
 
-------------------------------------------------
border-width: 边框的粗细
 
border-style:dashed 虚线 solid 实线边框 dotted 点线边框
 
border-color 边框颜色
 
 
---------------------------------------------------
边框的复合写法
 
border: 1px solid red; 没有顺序
border-top:1px solid red;  只要上边框
 
 
 
 

Tags:

说点什么吧
  • 全部评论(0
    还没有评论,快来抢沙发吧!

本栏推荐

标签云

站点信息

  • 文章统计96篇文章
  • 标签管理标签云
  • 微信公众号:扫描二维码,关注我们