zoukankan      html  css  js  c++  java
  • web前端CSS2学习2017.6.20

    十 列表属性(li)
    列表的项目符号
    list-style-type:disc(实心)/circle(空心圆)/square(方块)/none(不设置或者去掉)
    list-style-image:url("图片路径");可以用背景图来设置项目符号
    list-style-postion:outside(外面)/inside(里面);设置项目符号的位置

    缩写:
    list-style: type/image positon;
    list-style:none;去掉项目符号

    十一 表格属性(table)
    border-collapse:separate(表格独立)/collapse(相邻边合并)
    border-spacing:px/%;设置td与td之间的距离;

    布局总结:
    分类导航、菜单栏:div>>>>ul(ol)>>>>li
    显示数据:table>>>>>tr>>>>td
    表单布局:form(div)>>>>input

    十二 隐藏和显示
    visibility:visible/hidden
    visible:可见的
    hidden:隐藏
    display:none与visibility:hidden的区别
    前者的位置都没有了,后者将会保留位置

    十三 溢出处理
    overflow:visible/auto/scroll/hidden
    visible:默认值,当内容超出时,会显示在父元素框外
    auto:自动,当内容超出时,会出现滚动条
    scroll:无论内容有没有超出,都会出现滚动条
    hidden:当内容超出时,超出部分直接隐藏

    overflow-x:visible/auto/scroll/hidden,表示横向的溢出处理
    overflow-y:visible/auto/scroll/hidden,表示纵向的溢出处理

    十四 a标签的css属性
    1 text-decoration:none;去掉a标签的下划线
    2 outline:0 none;去掉a标签点击时出现的虚线,也可以去掉表单元素获取焦点时出现的边框
    3 <a href="#">回到顶部</a>---如果href的属性值为"#",有一个回到顶部的效果
    4 如何去掉a标签给图片添加的边框?
    在img的css属性加上border:0 none;
    5 a标签的伪类选择器
    css的伪类选择器:用来添加一些选择器的特殊效果,且该样式不是作用于标签上,而是作用于该标签的行为上
    a:link{},未访问时出现的状态
    a:visited{},访问后出现的状态
    a:hover{},鼠标悬停时出现的状态---body里面的所有元素都有hover这个伪类
    a:active{},鼠标按下时出现的状态---body里面的所有元素都有active这个伪类

    如果a标签都要写上这四个伪类的样式,顺序应该为:L -->V -->H -->A

    十五 给元素添加手势
    cursor:pointer;

  • 相关阅读:
    JS动态计算rem
    Vue数据双向绑定原理
    NOI2019 退役记
    友情链接
    算法博客总结
    总结各类错误(always online)
    学习笔记:powerful number求积性函数前缀和
    LOJ#2409. 「THUPC 2017」小 L 的计算题 / Sum(生成函数)
    多项式简单操作
    LOJ #3103. 「JSOI2019」节日庆典
  • 原文地址:https://www.cnblogs.com/jiandandeboke/p/7124537.html
Copyright © 2011-2022 走看看