- 博客(23)
- 收藏
- 关注
RSS订阅原创 calc()函数
浏览器支持 在IE9+、Firefox、chrome、safari可以正常呈现。calc()函数支持 "+", "-", "*", "/" 运算；/* calc运算 */任何长度值都可以使用calc()函数进行计算；calc()函数使用标准的数学运算优先级规则；/* 左右两栏 */利用calc()实现三栏自适应布局。运算符前后都需要保留一个空格。运算符前后都需要保留一个空格。用于动态计算长度值，值灵活。语法： calc(表达式)
2022-10-17 20:45:29
111
1
原创 2、弹性盒子
子元素之前、之间、之后都留有空白空间，且空间自行分配,项目之间的间隔比项目与边框的间隔大一倍。justify-content 属性：设置主轴的对齐方式,弹性子元素在主轴方向上的对齐方式,space-evenly:弹性项目平均分布在该行上,相邻项目的间隔，项目与容器之间空间相等。flex-direction属性：设置主轴的方向，子元素的排列方向。
2022-10-17 20:41:26
173
原创 1、弹性盒子
弹性盒子是CSS3的一种新的布局模式。引入弹性盒布局模型的目的是提供一种更加有效的方式来对一个容器中的子元素进行 排列、对齐和分配空白空间操作方便，布局简单，移动端使用广泛PC端浏览器支持情况较差IE11或更低版本中，不支持或部分支持在盒模型中较为灵活弹性盒模型的内容包括：弹性容器、弹性子元素——项目原理：为父元素设置flex属性，控制子元素的位置及排列方式应用场景 : 移动端。
2022-10-17 20:39:20
69
原创 新增选择器
ele:nth-last-child(n){ } 选择一组相同元素中的倒数第n个元素，n表示数值、关键词、表达式。ele:nth-child(n){ } 选择一组相同元素中的第n个元素，n可以是数值、关键词、表达式。ele:nth-last-of-type(n){ } 选择一组元素中特定类型的倒数第n个ele元素。ele:last-of-type 选择一组元素中特定类型的最后一个子元素的每个元素。ele:nth-of-type(n){ } 选择一组元素中特定类型的第n个ele元素。
2022-10-17 20:36:46
51
原创 css3基础
是css技术的升级版本，在css2的基础上，新增了许多特性，弥补了css2的不足，使web页面的开发变得更加高效、便捷css3按模块化进行设计，比较重要的css3模块包含、 选择器、框模型、背景和边框、文本效果、2D|3D转换、动画、多列布局、用户界面css3优点: CSS3是完全向后兼容，所以没有必要修改现在的设计来让它们继续运作。网络浏览器也还将继续支持CSS2。
2022-10-17 20:34:30
47
原创 新增表单元素和表单属性
min、max、step属性 最小值、最大值、合法的数字间隔 用于包含数字的input类型，规定数值范围，如:input的number类型等。用于输入电话号码的文本输入域，服务于触屏网页开发，在电脑网页中无效，在触屏网页中点击输入域，显示虚拟电话键盘（0-9、*、#）placeholder属性 设置文本域的提示信息，当用户开始输入内容，提示信息会消失。包含e-mail地址的输入域，在提交表单时，自动验证email域的值。包含访问协议的完整路径的输入域，在提交表单时，自动验证url域的值。
2022-10-17 20:30:25
100
原创 html5里废弃的一些标签
MP3 audio/MPEG 支持浏览器 chrome、firefox、OPera10+、IE9+、safari。wav audio/wav 支持浏览器 chrome、Firefox、Opera、Safari。ogg audio/ogg 支持浏览器 chrome、Firefox、Opera10+ogg 支持的浏览器chrome、Firefox、OperaMPEG4--mp4。支持的浏览器chrome、Firefox、Safari、IE9+WebM。支持的浏览器chrome、Firefox、Opera。
2022-10-17 20:27:37
239
原创 HTML5
html经过了第5次重大改版,增加了一些语义化的标签 高版本浏览器支持,ie9以下不支持, html5是向后兼容的,原来html4的 标签仍然可以用新特性新增语义化元素新增表单相关新元素、新属性新增canvas元素canvas 元素使用JavaScript 在网页上绘制图像新增了多媒体相关的video和audio元素地理信息HTML5通过引入Geolocation的API可以通过GPS或网络信息实现用户的定位功能，定位更加准确、灵活对本地存储的更好支持。
2022-10-17 20:22:15
60
原创 阿里矢量图标(字体图标) 、 阴影
1.使用步骤1.登录阿里矢量图标网站2.搜索想要的图标且加到购物车3.点击右上角的购物车4.选择下载代码，下载完成后解压文件5.把下载的文件放到你的项目中6.引入iconfont.css文件或者iconfont.js文件使用三种方式：下载代码1、Unicode 方式引用Unicode 是字体在网页端最原始的应用方式，特点是：兼容性最好，支持 IE6+，及所有现代浏览器。支持按字体的方式去动态调整图标大小，颜色等等。但是因为是字体，所以不支持多色。
2022-10-08 20:56:40
215
原创 css其他属性
webkit-box-orient必须结合的属性，设置或检索伸缩盒对象的子元素的排列方式。它是一个独立的渲染区域，只有Block-level box参与，它规定了内部的Block-level Box如何布局，并且与这个区域外部毫不相干。内部的Box会在垂直方向，一个接一个地放置 Box垂直方向的距离由margin决定，属于同一个BFC的两个相邻Box的margin会发生重叠。每个元素的margin box的左边，与包含块border box的左边相接触(对于从左往右的格式化，否则相反)，
2022-10-08 20:52:05
45
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人