当前位置: 首页 > news >正文

Web前端学习:六 -- 练习小总结

1、背景颜色+透明度写法:

background:rgba(R,G,B,Alpha透明度)
透明度范围:0–1,1=完全不透明,0=完全透明
在这里插入图片描述

2、伪类

hovar:
当鼠标接触该元素是,显示另一种样式
在这里插入图片描述
在这里插入图片描述

3、边框阴影:

box-shadow :向边框添加一个或多个阴影。

标准写法:
box-shadow:阴影类型 X轴位移 Y轴位移 阴影大小 阴影扩展 阴影颜色
box-shadow:2px 2px 10px #06C;
img{box-shadow:0 0 10px 20px rgba(0, 255, 0, .5);}
若是不写类型,及默认为投影效果;若设为inset,即为内阴影效果

4、居中

text-align: center;
一般用于里面的文字居中,可以控制img等元素,水平居中
margin: 0 auto;
让自己的元素居中,0是高度,可变,auto代表左右,水平居中

5、居中框架结构

个人理解:
可以分3层
最外面的div:最大的框架,控制该部分的具体位置,和要占用的空间
中间的div:小框架,进行居中等操作
元素:即要在页面中显示的内容
在这里插入图片描述

6:百分比宽度设置

当出现div中有多个并排的div共同占用一整行时
如果使用固定值来设置宽度,在页面拉伸是会出现div被挤下去的现象,
在这里插入图片描述

可以使用百分比来设置宽度,保证页面在拉伸时正常显示
在这里插入图片描述

baozh

http://www.lryc.cn/news/33185.html

相关文章:

  • 微服务之 CAP原则
  • 乐鑫特权隔离机制 #4 | 用户应用程序的安全启动
  • 剑指 Offer 46. 把数字翻译成字符串
  • tar命令——归档/压缩和解压缩文件
  • Softing smartLink网关——推进过程工业数字化转型
  • Spark的常用算子
  • Unity Avatar Cover System - 如何实现一个Avatar角色的智能掩体系统
  • steam/csgo搬砖项目到底真的假的?
  • 【Python笔记20230307】
  • SBOM应该是软件供应链中的安全主食
  • [计算机组成原理(唐朔飞 第2版)]第一章 计算机系统概论 第二章 计算机的发展及应用(学习复习笔记)
  • Python的数据分析相关的框架
  • 为什么会出现植物神经紊乱 总是检查不出来该怎么办
  • 宏任务和微任务
  • 使用WebSocket、SockJS、STOMP实现消息实时通讯功能
  • C++回顾(十一)—— 动态类型识别和抽象类
  • 雷电模拟器安卓7以上+Charles抓包APP最新教程
  • vsvode 配置sftp,连接远程linux全过程
  • C++类转换为蓝图、打印日志、蓝图关卡、删除C++文件
  • elasticsearch高级篇:核心概念和实现原理
  • 部署安装Nginx服务实例
  • 云原生架构设计原则及典型技术
  • 【Linux】-- 工具介绍 vim_gcc/g++_gdb
  • JAVA SE: IO流
  • 打破原来软件开发模式的无代码开发平台
  • 06-redux中的hook
  • watch监听不到数组对象的变化
  • 言语理解与表达之语句表达
  • 2023年全国最新食品安全管理员精选真题及答案14
  • 【MySQL】约束