自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(25)
  • 收藏
  • 关注

原创 文本溢出处理显示省略号

C:/Users/Administrator/Desktop/web/系统班课程大纲/day08/笔记/image-20210414133803719.png。可以沉迷,可以抱怨,可以奔溃,,可以抱怨,可以奔溃,人要有自愈能力可以沉迷,可以抱怨,可以奔溃,,可以抱怨,可以奔溃,人要有自愈能力。/* 溢出显示省略号 *//* 设置宽度可以微调省略号的盒子大小,盖住多余的文字 *//* 设置宽度可以微调省略号的盒子大小,盖住多余的文字 */

2023-02-27 11:50:43 96

原创 阿里矢量图标(字体图标)使用

这是一种全新的使用方式,应该说这才是未来的主流,也是平台目前推荐的用法。添加新的图标下载文件后,把原来的文件替换掉,再把iconfont.css和iconfont.js文件链接替换一下即可。如果添加新的图标,可以把这些图标添加到已有的项目文件,这样原来的图标和这次新添加的图标就可以在新的一个文件里了。如果添加新的图标,需要再新下载一个文件,且这个文件的图标与上个文件的图标不能在一个文件中,是两个独立的文件。3.解压文件,把文件放到代码中(此时下载的这个文件包括上次选的图标,也包括这次选的新的图标)

2023-02-27 11:49:07 472

原创 状态选择器

ele:last-of-type{} 选择一组元素中特定类型的最后一个子元素。ele:last-of-type{} 选择一组元素中特定类型的第一个子元素。ele: first-child{} 选择一组相同元素中的第一个元素。ele: last-child{} 选择一组相同元素中的最后一个元素。ele:nth-of-type{} 选择一组元素中特定类型的第n个元素。:root{} 匹配文档的根元素(不常用)enabled属性:使元素处于可用状态。checked属性:使元素处于选中状态。

2023-02-27 11:07:41 85

原创 复合选择器

* 鼠标悬停到.box3上,让p标签和h3标签的文字颜色都变为blue *//* 鼠标悬停到.box1盒上,让其本身的背景颜色变为蓝色 *//* 鼠标悬停到.box2盒上,让p标签文字颜色变为红色 */- :hover不仅可以表示链接的悬停,也可以用于其他标签中。a:visited{ 链接访问过后的样式 }a:active{ 鼠标按下的样式 }a:hover{ 鼠标悬停的样式 }a:link{ 链接的默认样式 }> 四个伪类状态都有效:L-v-H-a。- 用于设置链接的不同状态。### 2、相邻选择器。

2023-02-26 13:03:09 62

原创 HTML列表标签及表格语法

电话

2023-02-26 12:59:38 237

原创 常用HTML标签

本地文件1伪链接

2023-02-26 12:53:57 43

原创 css相关命名

shop(如购物车,收银台) 搜索:search 登陆:login 注册:regsiter 下载:download。广告:banner 导航:nav 子导航:subNav。菜单:menu 子菜单:subMenu 搜索:search。滚动:scroll 页面主体:main 内容:content。如:#header{属性:属性值;

2023-02-26 12:48:46 34

原创 弹性盒子及其语法

弹性盒子

2023-02-26 12:45:07 97

原创 渐变及其语法

backgrond: repeating-radial-gradient(渐变形状/圆心, 颜色1 范围1, 颜色2 范围2, ...);background:repeating-linear-gradient(方向, 颜色1 范围1, 颜色2 范围2,...);backgrond: radial-gradient(渐变形状, 颜色1 范围1, 颜色2 范围2, ...);background: linear-gradient(方向, 颜色1 范围1, 颜色2 范围2,...);

2023-02-26 12:37:13 86

原创 阴影+背景属性

contain:包含,等比例缩放背景图片到完整显示在盒子中,有一边到达边界就停止放大, 可能导致另一边留白 但是背景图可能在区域范围内铺不满(宽高给大点)正数阴影扩大(阴影大小大于盒子大小),负数阴影缩小(阴影大小小于盒子大小),0阴影与盒子同等大小。/* contain:包含,等比例缩放背景图片到完整显示在盒子中,但是背景图可能在区域范围内铺不满(宽高给大点) */- background-clip: content-box;/* 背景被裁剪到边框区域,在内容区、内填充区、边框区域显示,默认值 */

2023-02-25 16:49:37 53

原创 HTML5新增的语义标签

用于输入电话号码的文本输入域,服务于触屏网页开发,在电脑网页中无效,在触屏网页中点击输入域,显示虚拟电话键盘(0-9、*、#)- 典型应用:论坛帖子、杂志或新闻文章、博客、用户提交的评论、交互式组,或者其他独立的内容项目。- MPEG4--mp4 支持的浏览器chrome、Firefox、Safari、IE9+- 作用:元素表示文档、页面、应用或网站中的独立结构,可以成为可独立分配的或可复用的结构。HTML5新增了页眉、页脚、内容块等文档结构相关的标签,可以使文档结构更加清晰明确。

2023-02-25 16:45:00 439

原创 实现三角形 梯形 圆

宽是高的一半其圆角不用百分比。确定三角形方向,更改其颜色。确定三角形方向,更改其颜色。高宽相等,边框圆角为50%设置边框,其颜色为透明色。设置边框,其颜色为透明色。

2023-02-24 17:19:57 33

原创 CSS 定位

普通文档流中块元素垂直排列,行内元素水平排列。定位能够让我们把一个元素从它原本在正常布局流中应该在的位置移动到另一个位置(自由的在某个盒子内移动位置或者固定在屏幕中的某个位置)

2022-10-06 13:19:36 61

原创 CSS字体 ,文本属性

可继承的属性 font-size font-family font-style font-weight font line-height text-align text-indent color。白色: rgb(255,255,255) 、黑色 : rgb(0,0,0) 红色: rgb(255,0,0) 、绿色: rgb(0,255,0) 、蓝色: rgb(0,0,255)/*font-family:"宋体","微软雅黑";/*font-family:"微软雅黑","宋体";

2022-10-03 20:29:50 46

原创 浮动特性应用实例

我是文本内容

2022-10-02 21:36:23 44

原创 响应式设计

也叫响应式布局,响应式开发实现不同屏幕分辨率的终端上浏览网页的不同展示方式。响应式布局是根据设备屏幕宽度不同适当调整标签显示的布局,从而在每种设备屏幕宽度下呈现的界面是不同的。

2022-10-02 21:31:24 70

原创 帧动画内容

keyframes 动画名称(英文) {/* 动画的开始 */​/* 在25%的时候进行的一个动画 */​/* 在50%的时候进行的一个动画 */​/* 动画结束 */​}​from,to表示开始、结束状态,也可以使用0%,100%定义​@keyframes 动画名称(英文) {/* 动画开始 */​/* 动画结束 */}

2022-10-01 18:47:48 68

原创 css2d动画

* skew(30deg,45deg) 围绕 X 轴把元素翻转 30 度,围绕 Y 轴翻转 45 度 */单位:deg ​ 当角度值为正数时,元素沿着顺时针方向旋转 ​ 当角度值为负数时,元素沿着逆时针方向旋转。transform: translate(x,y) 沿着x轴和y轴移动。沿着中心点旋转,默认值。transform: translateX(x) 沿着x轴移动。transform: scale(x,y) 沿着x轴和y轴缩放。transform: skew(x,y) 沿着x轴和y轴倾斜。

2022-09-26 17:11:08 127

原创 弹性盒子及用法

弹性盒子是CSS3的一种新的布局模式。引入弹性盒布局模型的目的是提供一种更加有效的方式来对一个容器中的子元素进行 排列、对齐和分配空白空间操作方便,布局简单,移动端使用广泛PC端浏览器支持情况较差IE11或更低版本中,不支持或部分支持在盒模型中较为灵活弹性盒模型的内容包括:弹性容器、弹性子元素——项目原理:为父元素设置flex属性,控制子元素的位置及排列方式应用场景 : 移动端。

2022-09-25 14:54:24 131

原创 HTML5

是css技术的升级版本,在css2的基础上,新增了许多特性,弥补了css2的不足,使web页面的开发变得更加高效、便捷css3按模块化进行设计,比较重要的css3模块包含、 选择器、框模型、背景和边框、文本效果、2D|3D转换、动画、多列布局、用户界面css3优点: CSS3是完全向后兼容,所以没有必要修改现在的设计来让它们继续运作。网络浏览器也还将继续支持CSS2。

2022-09-25 09:46:00 51

原创 HTML5及CSS3

是css技术的升级版本,在css2的基础上,新增了许多特性,弥补了css2的不足,使web页面的开发变得更加高效、便捷css3按模块化进行设计,比较重要的css3模块包含、 选择器、框模型、背景和边框、文本效果、2D|3D转换、动画、多列布局、用户界面css3优点: CSS3是完全向后兼容,所以没有必要修改现在的设计来让它们继续运作。网络浏览器也还将继续支持CSS2。

2022-09-17 16:18:40 206

原创 css特性 css浮动

网页中有很多布局效果,标准流没有办法完成,使用可以利用浮动改变元素默认的排列方式,

2022-09-16 14:17:55 57

原创 css定位

如果元素的四个边的位置是使用“top”、“right”、“bottom”和“left”来描述的,那么元素的“height”和“width”将隐式地由偏移量决定。注意:所有的元素都能使用以上的属性,元素脱离正常文档流之后,不再区分块级和行级元素,宽度没有设置时,由内容撑开,行内元素可以设置宽高,类似于行内块元素。表示“将元素放在文档布局流的默认位置,HTML 元素的默认值,即没有定位,遵循正常的文档流对象。没有定位父级时相对于html进行定位,有定位父级时相对于最近的定位父级进行定位。

2022-09-15 23:11:19 61

原创 HTML表单元素

我是一个文本框

2022-09-11 19:32:33 183

原创 html表格

电话reversed属性: 倒序 写在start属性: 开始值 写在开始标签中。语法:电话>/td>语法:电话

2022-08-24 21:05:40 59

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除