关键字:position
  • 网站页面设计笔记--前期准备与Header制作
    前期准备 1.建立文件结构。然后分成资源和提供两个文件夹。一个存入本地使用,一个存入外部引入(Grid布局和normalize css在外部)再分别放入图片/css/js之类的 image.png 2.通过link使用文间结构中的css i ...
  • web前端入门到实战:来做一个简单的蔚来汽车官网首页
    首先来看看蔚来官网长什么样子 不会做动图,所以具体效果可以去蔚来官网看 HTML 根据效果,我们来分析一下 页面加载进去后会有黑色的背景,然后慢慢地图片和文字动画加载出来说明背景图不是在父亲节点加背景图片,否则不会有黑色背景和图片的动画那么 ...
  • web前端入门到实战:在CSS中解决内容过长的问题
    当我们写css的时候,有时候会忘记设计里面存在的临界情况。举个例子来说吧,当内容的长度超过了我们的期望值,我们也无法解释其中的可能性,页面的设计很可能会因此而崩掉。我们不能保证css总是会按照我们期望的那样工作,但至少我们可以用不同类型的内 ...
  • web前端入门到实战:关于CSS过渡(transition),你需要知道的事
    CSS3的过渡属性,给web应用带来了简单优雅的动画,但是比起初次相见,他(transition)有许多细则。 在这片文章中,我将会专研CSS3的过渡(transition)中更加复杂的部分,从链式和事件到硬件加速和动画函数。 让浏览器控制 ...
  • web前端入门到实战:CSS通用数据类型
    CSS中属性的值有着许多种格式。为了让用户代理(即浏览器)能够识别一个值是否有效,则需要确认该值是否符合该类值支持的格式的其中一种。这些属性值所支持的格式叫做数据类型,在规范中用的形式标识。 CSS中存在两种数据类型——特定数据 ...
  • 漫漫前端之路 CSS -- Flexbox和Position布局讲解
    之前因为客户端引入Facebook的YOGA库,以及微信小程序学习的原因,对于前端的布局有一定的了解。书读百遍其义自见,不经常使用的工具还是需要时不时学习,比如Flexbox和Position布局。 1. 流式布局 在未设置其他任何布局的情 ...
  • JavaScript 实现屏幕截图
    方法一 需要安装file-saver,html2canvas插件 handleExport() { let htmlDom = document.querySelector('#centerPark'); var ...
  • 小程序标签展开收起功能实现
    先看效果 收起时 展开后 主要结构 我用的mpvue,如用原生标签直接转换成原生即可 <div class="label userLabel" v-for="(label,inx) in la ...
  • web前端入门到实战:CSS :placeholder-shown伪类实现输入框浮动文字效果
    在这篇文章中,我们将使用:placeholder-shown伪类创建一个浮动的问题标签效果,使用纯CSS实现。 浮动的文字标签 当我们处理输入框时,会想方设法提供给用户更好的体验。有两个标签属性是我们经常会用到的: label标签是关联表单 ...
  • web前端入门到实战:CSS中的背景属性background简述
    我之前提到的那样,文档树中的每个元素只是一个矩形盒子。这些盒子都有一个背景层,背景层可以是完全透明或者其它颜色,也可以是一张图片。此背景层由8个CSS属性(加上1个简写的属性)控制。 background-color background- ...

暂无数据