美文网首页
2.常用CSS

2.常用CSS

作者: 1只念旧的兔子 | 来源:发表于2019-04-18 00:20 被阅读0次
  • background: linear-gradient(to bottom, #D8D8D8,#fff, #D8D8D8); 上#D8D8D8 中#fff 下#D8D8D8 的颜色渐变

  • background:linear-gradient(#d0d0d0, white);颜色渐变(上到下)
    position: absolute; 绝对定位(相对于外面一层div的绝对定位)

  • text-shadow: 1px 1px 1px #666; filter: Shadow(Color=#666666, Direction=135, Strength=5); 文字阴影

  • box-shadow: 5px 5px 5px #666; -moz-box-shadow: 5px 5px 5px #666; -webkit-box-shadow: 5px 5px 5px #666; 盒子阴影

  • position:fixed; right: 20rpx;定位到右边 相对于浏览器窗口进行定位。

  • float:right; 浮动是针对上级 clear: both;清除浮动

  • text-decoration: line-through 原价效果(文字中间有斜杠)

  • display: flex;
    justify-content: center;
    flex-direction: column-reverse; 竖向排列并且倒序,按比例居中

  • display: flex;
    flex-direction: column; 纵向 display: flex; flex-direction: row; 横向

  • \n空格 <hr />下划线 <br />空格 text-align: center;文本居中

  • display 属性 block,可以让行内元素表现得像块级元素一样,图片变得没有外边距 none,让生成的元素根本没有框。
    display: none; 隐藏 display: block; 显示
    display: inline 使段落生出行内框 inline-block 让块级元素变为行内元素

  • letter-spacing:5rpx; 字间距
    text-align: right; 文本靠右

  • width: 500rpx;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2; 文字超出两行省略

定位 position 它的值为:

absolute 生成绝对定位的元素,相对于 static 定位以外的第一个父元素进行定位。 通过 "left", "top", "right" 以及 "bottom" 属性进行规定。

fixed 生成绝对定位的元素,相对于浏览器窗口进行定位。通过 "left", "top", "right" 以及 "bottom" 属性进行规定。

relative 生成相对定位的元素,相对于其正常位置进行定位。

static 默认值。没有定位,元素出现在正常的流中(忽略 top, bottom, left, right 或者 z-index 声明)。

inherit 规定应该从父元素继承 position 属性的值。

相关文章

  • 2.常用CSS

    background: linear-gradient(to bottom, #D8D8D8,#fff, #D8D...

  • 2018-06-19

    A.今天学到什么 1.什么是HTML和CSS 2.常用的HTML标签 3.常用的CSS样式 3.1CSS基本语法 ...

  • day01

    A.今天学了什么 1.html是什么;css是什么. 2.常用的html标签有. 3常用的css样式 4.css常...

  • day01

    今天学了什么 1.什么是html , 什么是css 2.常用的html标签 3.常用的css样式 border ...

  • day01

    A我今天学了什么 1.常用的HTML标签 2.常用的css样式 3 css常用选择器 4.盒子模型image.pn...

  • day1

    A今天学习内容 1.html常用标签 2.常用的css样式 3.CSS常用选择器 4.盒子模型盒子模型.jpg 5...

  • day01

    今天开始用vs code 编写前端网页 1.什么是HTML和CSS 2.常用的HTML标签 3.常用的CSS样式 ...

  • day01

    A 今天学到了什么 html和css是什么 2.了解html标签 3.常用的html标签 4.常用的css样式 5...

  • 标签

    基础知识 1.什么是html什么是css 2.常用的html标签 3.盒子模型 4.css常用选择器

  • day07

    1.今天学到了 1.css常用样式的讲解 2.公共样式 2.iframe 2.CSS的常用样式 2.1.边框bor...

网友评论

      本文标题:2.常用CSS

      本文链接:https://www.haomeiwen.com/subject/knrnwqtx.html