• css这一段时间学习中遇到的比较有用,但是容易忘记的属性


    overflow-x:hidden; //将X轴的滚动条隐藏
    overflow-y:hidden; //将Y轴的滚动条隐藏

    position:定位属性
    absolute(常用) 生成绝对定位的元素,相对于 static 定位以外的第一个父元素进行定位。
    元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。
    fixed 生成绝对定位的元素,相对于浏览器窗口进行定位。
    元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。
    relative(常用) 生成相对定位的元素,相对于其正常位置进行定位。
    因此,"left:20" 会向元素的 LEFT 位置添加 20 像素。
    static 默认值。没有定位,元素出现在正常的流中(忽略 top, bottom, left, right
    或者 z-index 声明)。
    inherit 规定应该从父元素继承 position 属性的值。

    padding: 内边距
    margin: 外边距
    outline:none; 去掉选中时文本框外面的边框
    border-radius; 圆角,单位可以为像素
    float:浮动
    div{display:inline;} 让DIV平等布局
    解决按钮或图片和文本框不在一条线的问题:
    将文本框和图片设置相同高度,然后往左浮动
    解决input文本框点击时外面的边框效果如何隐藏的问题:
    input:focus {outline:none;}
    解决input文本框中将文字放在背景图片右边的问题:
    padding-left: 5%;
    颜色渐变(to left表示向左渐变)颜色向左渐变,由粉色到灰色
    background: linear-gradient(to left, #ffe2e7 30%,#dddddd 100%);
    //设置max-width 后,图片开始自适应
    img {
    display: block;
    max- 100%;
    }
    text-decoration: none; //清除超链接下划线
    :underline; //加一条下划线
    display属性:
    none //此元素不会被显示。
    block //此元素将显示为块级元素,此元素前后会带有换行符。
    inline //默认。此元素会被显示为内联元素,元素前后没有换行符。
    list-style: outside none none;这句代码的意思是? outside:默认值。保持标记位于文本的左侧。列表项目标记放置在文本以外,且环绕文本不根据标记对齐。
    list-style: 包含了三个属性:list-style-position、list-style-type、list-style-img。也就是说给他们分别赋值。
    html {}的CSS 中设置625%相当于100px
    line-height: //行高
    div {box-sizing: border-box;} //布局忽略边框计算
    white-space : 属性设置如何处理元素内的空白。
    normal 默认。空白会被浏览器忽略。
    nowrap 文本不会换行,文本会在在同一行上继续,直到遇到 <br> 标签为止。
    box-shadow: 0 1px 10px rgba(0, 0, 0, 0.3); 是给文字添加阴影效果 4个值的含义分别是:
    0:阴影水平偏移值(可取正负值);
    1px:阴影垂直偏移值(可取正负值);
    1px:阴影模糊值;
    rgba(0,0,0,0.3):阴影颜色;
    opacity : 设置div元素的不透明级别
    background-color: transparent; 设置背景颜色为透明
    text-indent 属性规定文本块中首行文本的缩进。
    input {border: none;} 将input的边框去掉
    vertical-align 图像垂直对齐方式
    white-space 规定段落中的文本不进行换行
    text-overflow 规定当文本溢出包含元素时发生的事情。
    当值为ellipsis时,显示省略符号来代表被修剪的文本。
    filter 滤镜当值为blur时即模糊效果
    a链接的用法:
    a:link,定义正常链接的样式;
    a:visited,定义已访问过链接的样式;
    a:hover,定义鼠标悬浮在链接上时的样式;
    a:active,定义鼠标点击链接时的样式。
    如果想要让div中的文字垂直居中,需要将div的高度和行高设成相同大小

  • 相关阅读:
    angular学习之通俗易懂篇-----constructor()与ngOnInit()
    vscode----快捷键
    angular学习之通俗易懂篇-----路由
    angular学习之通俗易懂篇-----双向数据绑定MVVM
    angular学习之通俗易懂篇-----数据绑定
    angular学习之通俗易懂篇-----新建组件并调用
    angular学习之-----常用命令行
    windows环境下node更新最新版本----简单粗暴
    首例爬虫禁令:法院裁定立即停止擅自爬取微信公众号相关数据行为取微信公众号相关数据行为
    Pycharm两种快速激活方式(附最新激活码和插件)
  • 原文地址:https://www.cnblogs.com/daijun/p/6368265.html
Copyright © 2020-2023  润新知