首页 > 其他分享 >盒子文字的阴影 和 浮动

盒子文字的阴影 和 浮动

时间:2023-03-23 21:02:50浏览次数:38  
标签:浮动 知识点 盒子 0.3 元素 阴影 10px

知识点一:

盒子模型的阴影是四个数值,

box-shadow:10px     10px  10px   -4px      rgba(0,0,0,0.3);

文字阴影:

盒子文字的阴影   和  浮动_行内元素

text-shadow:5px  6px    5px   rgba(0,0,0,0.3);

知识点二:浮动

标准流:块元素、行内元素、行内块元素;

知识点三:浮动的安排

网页布局第一准则:多个块级元素纵向排列,用标准流;

                            多个块级元素横向排列,找浮动;

float用于创建浮动框,将其移动到一边,直到左边缘或右边缘触及包含块或另一个浮动框的边缘。

盒子文字的阴影   和  浮动_行内元素_02

盒子文字的阴影   和  浮动_块元素_03

知识点四:浮动特性

1.脱离标准普通流的控制(浮),移动到指定位置(动)(俗称脱标)

2.浮动的盒子不再保留原先的位置

注意:设置浮动会出现一个盒子遮挡另外一个盒子的现象;

盒子文字的阴影   和  浮动_块元素_04

标签:浮动,知识点,盒子,0.3,元素,阴影,10px
From: https://blog.51cto.com/u_15987796/6145958

相关文章

  • CSS3弹性盒子
    传统布局与flex布局传统布局兼容性好布局繁琐局限性,不能在移动端很好地布局flex弹性布局操作方便,布局极为简单,移动端应用很广泛PC端浏览器支持情况不如移......
  • 弹性盒子模型
    弹性盒子模型(flexbox)定义弹性盒子是CSS3的一种新的布局模式CSS3弹性盒子是一种当页面需要适应不同的屏幕大小以及设备类型时确保元素拥有恰当的行为的布局方式引入......
  • css实现文字的条纹阴影效果
    先写下一段文字添加重复的线性渐变,该渐变倾斜45deg(倾斜角度依需求设置)上面的为黑色、透明色的渐变,实际上渐变的颜色需要跟文字的背景颜色相同,如果文字的背景色是白色那......
  • 限制左键拖拽图片阴影vue
    <template><div><imgref="image":src="imageUrl":style="imageStyle"/></div></template><script>exportdefault{data(){return{i......
  • CSS盒子模型(Box Model)
    CSS盒子模型(BoxModel) 概念所有HTML元素可以看作盒子,在CSS中,"boxmodel"这一术语是用来设计和布局时使用CSS盒子模型本质上是一个盒子,封装周围的HTML元素,它包......
  • 【Unity3D】绘制物体外框线条盒子
    1需求描述​点选物体、框选物体、绘制外边框中介绍了物体投影到屏幕上的二维外框绘制方法,本文将介绍物体外框线条盒子绘制方法。内框:选中物体后,绘制物体的内框(紧......
  • 盒子模型——页面布局的灵魂
       ......
  • 浮动
    1.浮动(float)1.1传统网页布局的三种方式网页布局的本质———用CSS来摆放盒子。把盒子摆放到相应位置。CSS提供了三种传统布局方式(简单来说,就是盒子如何进行排列顺序):1.......
  • 盒子结构“数据的存储”
    今日份学习“数据的存储”本文简介:C语言中的数据类型有整型,字符型,浮点型,以及结构体类型,我们知道这些类型是用来专门接收各个类型的数据的,但是这些类型的数据应该放在哪里呢?......
  • css盒子模型
    1、网页布局的本质网页布局的核心本质:就是利用CSS摆盒子。网页布局过程:先准备好相关的网页元素,网页元素基本都是盒子Box。利用CSS设置好盒子样式,然后摆放到相......