- 博客(28)
- 收藏
- 关注
RSS订阅原创 什么是响应式设计
也叫响应式布局，响应式开发实现不同屏幕分辨率的终端上浏览网页的不同展示方式。响应式布局是根据设备屏幕宽度不同适当调整标签显示的布局，从而在每种设备屏幕宽度下呈现的界面是不同的。
2022-10-26 17:59:31
542
1
原创 定义关键帧
keyframes 动画名称（英文） {/* 动画的开始 *//* 在25%的时候进行的一个动画 *//* 在50%的时候进行的一个动画 *//* 动画结束 */}from,to表示开始、结束状态，也可以使用0%,100%定义@keyframes 动画名称（英文） {/* 动画开始 *//* 动画结束 */}
2022-10-25 21:43:27
181
原创 css3过渡动画transition属性
1、transition-protertycss样式：参与过渡的css属性名称|all表示所有属性2、transition-duration动画执行时间：默认0s，s|ms(毫秒) 1s=1000ms3、transition-timing-function1.linear 相同的速度从开始到结束，也就是匀速 2.ease 默认值 慢速度开始--速度变快--慢速度结束 3.ease-in 慢速度开始的过渡效果，也就是以低速度开始 4.ease-out 慢速度结束的过渡效果，也就是以低速结束 5.ease-in
2022-10-24 22:02:12
1605
原创 总结笔记知识
1什么是语义化语义化是指用合理的HTML标记以及其特有的属性去格式化文档内容。2 语义化的好处在没有 CSS 的情况下，页面也能呈现出很好地内容结构。使代码更具可读性，便于团队开发和维护。有利于SEO搜索引擎优化（和搜索引擎建立良好沟通，有助于爬虫抓取更多的有效信息。爬虫依赖于标签来确定上下文和各个关键字的权重）。有利于用户体验无序列表，用于将没有数字顺序的一组数据或内容进行分组。无序列表,用于将顺序是有意义的一组数据或内容进行分组。
2022-10-23 16:17:24
93
原创 什么是视口
一般来讲，移动设备上的viewport都是要大于浏览器可视区域的，这是因为考虑到移动设备的分辨率相对于桌面电脑来说都比较小，所以为了能在移动设备上正常显示那些传统的为桌面浏览器设计的网站，移动设备上的浏览器都会把自己默认的viewport设为980px或1024px。在布局过程中只要使用 rem 设置元素的尺寸，在改变 rem 的基准值 html 的字体大小的时候，页面上的元素将等比例缩放实现适配。在PC端，正常的视口宽度就是整个浏览器的窗口可视区的宽度，会随着浏览器窗口大小的重置而缩放；
2022-10-20 07:53:51
1346
原创 移动端web开发
随着互联网技术的快速发展，加之智能设备的迅速普及,传统网站都已经逐渐向移动端转移和扩展,移动端web开发技术的掌握也显得尤为重要。移动端Web主要指运行在移动端（手机、ipad）的web页面, 因为具备HTML5特性也叫H5页面、Web App等。我们开发的网页，在不同的手机上，若想展示效果一致，必然不是为每一种型号手机都开发一套页面，而是要尽可能的能适配所有。2.能调用系统的 api 优点是性能更好，实现的一些非常酷的交互效果,但是发布 app 流程繁琐，而且不跨平台。和一般的web一样，维护比较简单。
2022-10-20 07:49:25
328
原创 【无标题】
默认值：autodefault 通常是一个箭头text 显示为光标pointer 光标呈现为指示链接的指针（一只手）move 此光标指示某对象可被移动e-resize 此光标指示矩形框的边缘可被向右（东）移动。ne-resize 此光标指示矩形框的边缘可被向上及向右移动（北/东）。nw-resize 此光标指示矩形框的边缘可被向上及向左移动（北/西）。se-resize 此光标指示矩形框的边缘可被向下及向右移动（南/东）。sw-resize 此光标指示矩形框的边缘可被向下及向左移动（南/西）。
2022-10-20 07:45:39
75
原创 【无标题】
随着互联网技术的快速发展，加之智能设备的迅速普及,传统网站都已经逐渐向移动端转移和扩展,移动端web开发技术的掌握也显得尤为重要。移动端Web主要指运行在移动端（手机、ipad）的web页面, 因为具备HTML5特性也叫H5页面、Web App等。【H5页面、微网页、微站、wap站、webAPP】如:京东商城手机版，淘宝触屏版，苏宁易购手机版。
2022-10-18 23:32:06
61
原创 弹性盒的属性
space-evenly:弹性项目平均分布在该行上,相邻项目的间隔，项目与容器之间空间相等。justify-content 属性：设置主轴的对齐方式,弹性子元素在主轴方向上的对齐方式,justify-content: flex-start;flex-direction属性：设置主轴的方向，子元素的排列方向。
2022-10-17 21:17:07
519
原创 【无标题】
HTML5新增了页眉、页脚、内容块等文档结构相关的标签，可以使文档结构更加清晰明确语义：定义整个文档或文档中一个节段的的头部（页眉）。表示页面中一个内容区块或整个页面的头部或者标题, 通常可以用来包含logo 搜索框 标题典型应用：整个页面的头部，某个区块的头部。
2022-10-13 22:36:27
137
原创 【无标题】
准备三个负责背景的盒子.bg1，.bg2，.bg3，HTML结构上层层嵌套将.left，.center，.right盒子放入最内层的背景盒子.bg3里最内层的盒子.bg3清浮动将.bg2，.bg3相对于当前位置进行移动，形成三列背景效果将.left，.center通过margin负值移动到对应的背景处即可。通过浮动创建一个正常的三列布局（不同列背景不同）父容器清浮动每一列固定padding-bottom，同时指定一个margin负值，抵销padding的占位父容器overflow:hidden。
2022-10-12 21:52:09
60
原创 CSS 定位布局的作用
定位能够让我们把一个元素从它原本在正常布局流中应该在的位置移动到另一个位置（自由的在某个盒子内移动位置或者固定在屏幕中的某个位置）。相对于元素在正常的文档流中的位置移动它，把一个正常布局流中的元素从它的默认位置按坐标进行相对移动。定位模式通过position属性来设置，以下为常用四种定位模式静态定位，相对对定位，绝对定位，固定定位。表示“将元素放在文档布局流的默认位置，HTML 元素的默认值，即没有定位，遵循正常的文档流对象。没有定位父级时相对于HTML进行定位，有定位父级时相对于最近的定位父级进行定位。
2022-10-11 21:56:03
326
原创 【无标题】
公用样式通常命名为reset.css（常用的浏览器样式）public.css（多个页面时的公共模块的样式，或多次重复使用字体、字号、间距等样式）首页通常命名为index.css, 其他页面依实际模块或功能需求命名图片文件命名尽量与其模块样式名称保持关联，尽量使用小写命名（如登录框的背景与图片：login_bg.jpg、login_user_ico.gif 等）常用图片格式 gif 、png 、jpg。HTML 文件、根据页面内容以英文命名，首页或只有一个页面通常命名为index.html。
2022-10-10 22:18:27
67
原创 ps的基础与简介
Cutterman是一款运行在photoshop中的插件，能够自动将你需要的图层进行输出，以替代传统的手工 "导出web所用格式" 以及使用切片工具进行挨个切图的繁琐流程。它支持各种各样的图片尺寸、格式、形态输出，方便你在pc、ios、Android等端上使用。它不需要你记住一堆的语法、规则，纯点击操作，方便、快捷，易于上手。Photoshop默认保存的文件格式，可以保留所有有图层、色版、通道、蒙版、路径、未栅格化文字以及图层样式等。色彩丰富的图片（摄影图像（产品图，照片，渐变，banner图））
2022-10-09 22:04:52
88
原创 阿里矢量图标
font-class 是 Unicode 使用方式的一种变种，主要是解决 Unicode 书写不直观，语意不明确的问题。因为使用 class 来定义图标，所以当要替换图标时，只需要修改 class 里面的 Unicode 引用。只能使用平台里单色的图标，就算项目里有多色图标也会自动去色。这是一种全新的使用方式，应该说这才是未来的主流，也是平台目前推荐的用法。不过因为本质上还是使用的字体，所以多色图标还是不支持的。兼容性最好，支持 IE6+，及所有现代浏览器。兼容性良好，支持 IE8+，及所有现代浏览器。
2022-10-08 22:51:32
77
原创 表单元素的内容
get将表单的数据按照vaeiablle=valae的形式进行传输，添加到action后所指向的url地址中。作用：用于用户时输入的提示信息，输入文字，提示信息直接，消失不会影响输入的内容。name是必须的，只有设置name属性为表单元素在提交的时候不会传递他们的值。为input标签的for属性进行连接ld属性通过label标签来连接for。作用：规定当前表单元素被禁用，被禁用的表单元素不只能编辑也不能提交。value属性：可以设置表单的初始值和修改按钮上的文字。作用：用来规定发送表单数据的传输方式。
2022-10-07 20:35:13
134
原创 表单元素的作用
作用：重置按钮，当type的值为reset时，定义重置按钮，将表单元素的内容重置到初始状态。type=radio name=six男 name=six女。form：定义表单区域，里面可以包括表单元素，实现用户信息的收集和传递。type=submit value=提交按钮。type=button value=“按钮”定义下拉列表，列表项option定义列表项。作用：收集不同类型的用户输入的数据。value=定义按钮显示文本。alt：指定文字图片的替换。rows：高度大小，行数。
2022-10-02 19:08:32
243
原创 怪异盒模型
的距离由margin决定属于同一个bfc的相邻的box的margin会发生塌陷。display转行内快（inline-block 也可以触发）在内部的box会垂直方向，一个接着一个的排序box在垂直方向。web页面中盒模型布局的css渲染模式块级模式渲染上下文。它是一个独立的渲染区域里面的元素和外面的元素毫不相干。实际高度=内容（height）中间盒子不会受到两边盒子的影响。他的宽度=内容（width）
2022-09-29 22:57:46
134
原创 定位的介绍、
相对元素在正常文档流中的位置移动它，把一个正常文档流的元素从它的默认值位置安坐标进行相对移动（相对定位他是相对于元素本身的位置发生移动）他原本所占的空间不会变。绝对定位：相对于定位父级的位置进行移动，如果没有定位父级，一层一层的往上找，一直找到body，相对于body进行定位。静态定位：把元素放在文档流的默认位置，盒子垂直排列html元素的默认值，也就是没有定位正常的文档流布局方式。能够让我们把一个元素从他原本在正常文档流的位置移动到另一个位置。固定定位（元素的位置相对浏览器的窗口进行位置移动）
2022-09-27 22:26:54
64
原创 块级元素和行级元素 css的三大特性
inherit 表示强制继承 font--weight ：inherit。h标签他不能继承font-weight：normal（字体加粗）在不设置宽度的情况下块级盒子的宽度是它父级元素内容的宽度。在不设置高度的情况下，块级盒子的高度是它本身内容的高度。em i 标签不能继承font--weight。作用：恰当使用继承可以简化代码，降低css的复杂性。可以默认并排显示，不能设置宽高宽高取决于内容。行级标签之间有间隙，他不可以设置上下外边距。文字类元素不可以使用块级元素。
2022-09-26 22:13:01
168
原创 外边距的问题
子元素与父元素直接相邻子元素的Margin的值会传递给父元素并且与父元素的margin的值发生合并，最终显示的结果取最大值，负值取绝对值得较大值。问题描述：当两个块级兄弟的垂直外边距直接相遇的时候，会发生合并最总结果取两者之间的最大值负值取绝对值的较大值。给其他盒子加父元素，overflow:hidden；在不设置宽度的情况下，块级元素盒子的宽度是它父元素内容的宽度。改变渲染规则（溢出隐藏）在不设置高度的情况下，块级元素的盒子的高度是他本身的高度。结构关系：相邻元素的垂直外边距会合并。
2022-09-24 22:16:50
49
原创 字体系列的认识和设置字体
*font-family:"宋体","微软雅黑";*//*与上一个相比产生的效果不同，谁在前使用哪一个*/如果用于字号，相当于父元素字号计算，如果用于其它属性，相对于当前元素的字号。/*产生的效果一致都是字号的两倍*//* font:italic bold 20px "宋体";/*第一个任意改写一个系统不存在的字体，会按照第二个字体显示*//*font-family:"微软雅黑","宋体";font-family:"微软雅黑abc","宋体";font: 字体风格 字体加粗 字号/行高 字体；
2022-09-23 07:09:43
581
原创 【无标题】
（即网页布局就是利用 CSS 摆盒子）是利用 CSS 摆盒子）1、概述CSS盒模型本质上是一个盒子，封装周围的 HTML 元素，它包括：边距、边框、填充、和实际内容。（即网页布局就是利用 CSS 摆盒子）1、概述CSS盒模型本质上是一个盒子，封装周围的 HTML 元素，它包括：边距、边框、填充、和实际内容。（即网页布局就是利用 CSS 摆盒子） CSS 摆盒子）1、概述CSS盒模型本质上是一个盒子，封装周围的 HTML 元素，它包括：边距、边框、填充、和实际内容。（即网页布局就是利用 CSS 摆盒子）
2022-09-21 22:52:26
81
原创 css字体属性 文本属性
italic 科体显示④.font-weight-作用=设置字体的粗细语法:font-weight:值取值=narmal黑A认值、正常粗。语法:font=字体风格.字体粗细 字号/行高、字体合列注意:只有字君和字体系列同时存在时简写才会生效。作用二镀置字体角分飘枪语法:font-ty/e漏性值。font-family：作用：设置字体系列。font-weight作用：设置字体的粗细。语法:line-height-值。语法:font-weight:值。语法:font-分ize:值。测量方法:①文字高十行同距。
2022-09-20 21:49:27
108
原创 无序列表，有序列表，锚点链接，相对路径，
1：以当前html文件为原点，（参照物）去建立关系,当期目录'上一级目录‘下一级目录。当前目录./+文件名（如果你的当前html和图片在同一目录 ./可以不用写）作用：提示文本，当鼠标悬停在链接上时会显示里面文字。self：当前窗口打开（默认值）特点：指向同一位置《无论在何处使用。../表示上一级目录。默认间距（上下外边距，内边距）导航新闻列表、产品列表。默认样式： 间距（外简距、内间距）列表样式：实心小圆点。默认带下划线，自带颜色。target：指定目标地址的打开方式。自定义列表：对专业名词进行解释。
2022-09-16 20:43:36
218
原创 学习了html，五大浏览器
2、网页：网页是网站中的一员，构成网页基本元素、图片。注意事项：h1在一个页面中只能有一个，h2到h6可以有很多。标题标签里面的文字的大小一次减小，重要程度依次减小。火狐：（firefox）这个只是英文名 Gecko。五大浏览器：TE 谷歌 火狐、欧朋、苹果。1文章的标题，内容的章节标签。div：双标签，搭建网页基本标签--小盒子。注意事项：p标签中不能嵌套块级元素。1宽度默认撑满整个父元素。h系列标签：标题标签。2高度默认有内容撑开。2宽度默认盛满整个父元素。1宽度默认撑开整个父元素。
2022-09-15 21:54:53
377
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人