1.CSS伪类选择器

结构伪类选择器:

  1. 结构伪类选择器的公式:nth-of-type(an+b)
  2. 正向取值演示:

正向取值演示

  1. * A的值是0,0乘以任何数都等于0,所以B的值就填写1,取第一行数据.
  2. * 当前也可也取一组数据.

正向取值演示

  1. * 反向取值演示:

反向取值演示

  1. * 获取倒数一组数据演示:

倒数一组数据演示

  1. * 取奇偶数:

取偶数

  1. * 取偶数的快捷方式::nth-of-type(even)

取奇数

  1. * 取奇数的快捷方式::nth-of-type(odd)
  2. * 语法糖总结:first-of-type=取第一个值 | last-of-type=取最后一个值

状态伪类选择器:

  1. * 获取有状态的元素方法:input:状态.这段代码指的是获取一个input标签,这个标签有一个状态.比如禁用状态就是:input:disabled
  • 状态伪类选择器的总结:
    • 鼠标悬停:hover
    • 获取焦点:focus

      2.盒模型常用属性

      DIV盒模型
  • margin[外边距-控制当前盒子与其他盒子的距离]
  • border[边框]
  • padding[内边距-内容区与边框之间的填充区块]
  • content[内容区]
  • 且要注意的是,margin和padding属于不可见属性,只能设置宽度,除此之外不能设置任何属性.在页面中看不到.
    盒模型尺寸
    • 需要注意的是,尽管我们在CSS中设置的是200像素的宽度和100像素的高度,但是在浏览器中我们看到的却是250像素的宽度和150像素的高度,这是因为浏览器自动把padding和boder的四条边的值也算进去了.这点需要注意!!!
    • 而如果必须要设置成CSS中设置的像素,也是有办法的.我们要用到一个属性:box-sizing
    • box-sizing这个属性需要注意的点是,你设置的宽高度,其实是包括了边框的.
      box-sizing
    • 还原尺寸也很简单,用到的属性是:box-sizing: content-box;
    • 对border边框进行设置可以用到如下属性:比如对上边框进行设置:border-top
    • border-top属性参数:宽度 样式 前景色
      上边框设置
    • 那么左右下边框一样的道理:border-left、border-right、border-bottom
    • 当然也有简化写法:
      • 当四条边都一样时,只写border:宽度 样式 前景色,即可.
      • 当四条边都不一样时,可以用如下方法:
      • padding: 10px 15px 20px 25px;他的顺序是上、右、下、左
        四条边都不一样
      • 当上下值不一样,左右值一样时,我们可以用如下方法:padding:10px 15px 20px;
      • 我们通过对比可以发现,第一个值对应的是上边,第三个值对应的是下边,第二个值对应的是左右两边.
      • 当上下值一样,左右值一样时,我们可以用如下方法:padding:10px 15px;
      • 我们通过对比可以发现,第一个值对应的是上下两条边,第二个值对应的是左右两条边.
      • 三值和二值的记忆方法为:第二个值永远表示左右.
      • 当四个方向全部一样时,我们设置一个单值即可:padding:10px;
      • 盒模型中:最重要的属性为:width、height、padding(不可视属性)、border(可视化属性)、margin(不可视属性)!

更多相关文章

  1. 关于EditText的android:maxLength属性的注意事项
  2. Android面试系列文章2018之Android部分之动画机制篇
  3. HTML标签与属性
  4. 2022年0707结构伪类与状态伪类与盒模型常用属性
  5. Android相对属性布局总结
  6. Android之EditText imeOptions属性解析
  7. android UI进阶之style和theme的使用
  8. Android属性动画的简单使用和总结
  9. Android(安卓)几张图片制作成动画

随机推荐

  1. c语言函数类型有几种
  2. c语言输出语句是什么
  3. 输入一个字符,如何判断是字母,数字还是特
  4. asp.net是什么?
  5. C语言怎么输入十个数输出最大值
  6. %lf在c语言中表示什么
  7. c程序编译后生成什么文件
  8. 在C语言中,要求参加运算的数必须是整数的
  9. c语言goto语句用法
  10. c语言中#define的用法