
前端学习
nine-seven
这个作者很懒,什么都没留下…
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
01 ajax
//添加响应头解决跨域 写在服务器端// res.setHeader(‘Access-Control-Allow-Origin’, ‘*’);**** 创建Ajax四个步骤:**//1.创建XMLHttpRequest 创建异步对象//兼容性创建对象,在非低版本IE存在window.XMLHttpRequest属性if(window.XMLHttpRequest){//非低浏览器var xhr = new XMLHttpRequest();}else{//IE5 IE6浏览器原创 2021-07-06 19:28:58 · 94 阅读 · 0 评论 -
004 rem布局 --- 移动WEB开发
rem适配布局1 rem基础 rem 单位;是一个相对单位,类似于em,em是父元素的字体大小(font-size)rem相对于html元素的字体大小rem优点就是通过修改html里面的为大小来改变页面中元素的大小进行整体控制html {font-size:12px;}P {height:10rem;width: 10rem;}p盒子就变成了120*120px的盒子2媒体查询 Media Query 媒体查询是 CSS3新语法可以针对不同屏幕尺寸设置不同原创 2020-05-12 10:54:21 · 252 阅读 · 0 评论 -
前端笔记--杂乱知识点
letter-spacing: 0.5px; //文字间距原创 2020-05-07 08:25:27 · 240 阅读 · 0 评论 -
003 flex布局--移动WEB开发
flex布局flex:通过给父盒子添加flex属性,来控制子盒子的位置和排列方式任何一个容器都可以指定flex布局,无论是块级元素还是行内元素为父盒子设置为flex布局之后,子元素的float、clear、clear和vertical-align将失效伸缩布局 = 弹性布局 = 伸缩盒布局 = 弹性盒布局 = flex布局给父元素添加flex属性: display:flex;1....原创 2020-05-06 09:46:51 · 228 阅读 · 0 评论 -
002 流式布局(百分比布局)--移动WEB开发
流式布局:流式布局,就是百分比布局,也称非固定像素布局。通过盒子的宽度设置成百分比来根据屏幕的宽度来进行伸缩,不受固定像素的限制,内容向两侧填充。流式布局方式是移动web开发使用的比较常见的布局方式。 - max-width 最大宽度 (max-height 最大高度) - min-width 最小宽度 (min-height 最小高度)案例:京东移动端首页访问地址:m.jd.co...原创 2020-05-06 09:31:43 · 364 阅读 · 0 评论 -
CSS(四)--3D转换
3D转换 3D特点:近大远小 物体后面遮挡看不见3D位移 translate3d(x,y,z)3D旋转 rotate3d(x,y,z)透视 perspective3D呈现 transform-style1.三维坐标系:三维坐标系:就是指立体空间,立体空间由3个轴共同组成x轴:水平向右 注意:x右边是正值,左边是负值y轴:垂直向下 注意: y下面是正值,上面是负值...原创 2020-04-30 08:19:33 · 566 阅读 · 0 评论 -
CSS(三)--动画
动画(animation)1.什么是动画动画是 CSS3 中最具颠覆性的特征之一,可通过设置多个节点来精确的控制一个或者一组动画,从而实现复杂的动画效果。2.动画的使用1、先定义动画2、在调用定义好的动画2.1 语法格式(定义动画)1.定义动画@keyframes 动画名称 { 0% { //开始状态 width: 100px...原创 2020-04-28 20:03:13 · 269 阅读 · 0 评论 -
CSS3(二)---2D转换(transform):移动(translate)、旋转(rotate)、缩放(scale)
1. 2D转换 二维坐标系(改变标签在二维平面上的位置和形状的一种技术)转换(transform) 是CSS3中具有颠覆性的特征之一,可以实现元素的位移、旋转、缩放等效果。移动 :translate旋转 :rotate缩放: scale移动盒子的位置:①定位 ②盒子的外边距 ③2d转换移动2.移动2.1 语法transform:translate(x,y); x就是x轴...原创 2020-04-28 19:53:57 · 721 阅读 · 0 评论 -
CSS3(一)---属性选择器、结构伪类选择器、伪元素选择器
CSS3属性选择器、结构伪类选择器、伪元素选择器、2D转换、动画、3D装换、浏览器私有转换CSS3是在CSS2上进行扩展1. 属性选择器属性选择器权重是10,类选择器、伪类选择器(属性选择器:权重高于标签选择器)disabled = “disabled” //禁用比如:button[disabled] { } 元素[属性] { }选择符:E[att] ...原创 2020-04-28 19:35:49 · 225 阅读 · 0 评论 -
html5--音频、视频、表单input
一、什么是 HTML51. HTML5 的概念与定义 大量使用移动端定义:HTML5定义了 HTML标准的最新版本,是对HTML的第五次重大修改,号称下一代的 HTML两个概念:- 是一个新版本的 HTML 语言,定义了新的标签、特性和属性- 拥有一个强大的技术集,这些技术集是指: HTML5 、CSS3 、javascript, 这也是广义上的 HTML2. HTML5 拓展了哪些内...原创 2020-04-28 19:00:00 · 578 阅读 · 0 评论 -
CSS(十二)--ico图标、优化三大标签、字体图标、logo优化、书写顺序
1.网站ico图标使用ico图标:在title栏显示1.1使用ico图标首先把favicon.ico 这个图标放到根目录下。再html里面, head 之间 引入 代码。 head标签中: <link rel="shortcut icon" href="favicon.ico" type="image/x-icon"/> 1.2制作ic...原创 2020-04-26 20:41:37 · 863 阅读 · 0 评论 -
CSS(十一)--文字居中和盒子居中区别、插入图片和背景图片区别、display显示模式、网页布局
文字居中和盒子居中区别盒子内的文字水平居中是 text-align: center, 而且还可以让 行内元素和行内块居中对齐块级盒子****水平居中 左右margin 改为 autotext-align: center; :文字 行内元素 行内块元素水平居中margin: 10px auto; :块级盒子水平居中 左右margin 改为 auto 就阔以了 上下margin都...原创 2020-04-26 20:25:15 · 496 阅读 · 0 评论 -
CSS(十)--CSS3- 新特性背景透明、圆角边框、盒子阴影、过渡
CSS3:1.背景透明:语法:background: rgba(0, 0, 0, 0.3);最后一个参数是alpha 透明度 取值范围 0~1之间我们习惯把0.3 的 0 省略掉 这样写 background: rgba(0, 0, 0, .3);注意: 背景半透明是指盒子背景半透明, 盒子里面的内容不受影响因为是CSS3 ,所以 低于 ie9 的版本是不支持的。2.圆角...原创 2020-04-26 20:17:10 · 1305 阅读 · 0 评论 -
CSS(九)---元素显示和隐藏、用户界面样式(鼠标、轮廓线、防止拖拽文本域)、vertical-align 垂直对齐、溢出的文字省略号表示、 去除图片底侧空白缝隙、精灵图、滑动门、三角
1.元素的显示和隐藏1.1 display 显示 display 设置或检索对象是否及如何显示display: none; : 隐藏对象display:block;: 除了转换为块级元素之外,同时还有显示元素的意思。特点: 隐藏之后,不再保留位置。应用: 配合后面js做特效,比如下拉菜单,原先没有,鼠标经过,显示下拉菜单, 应用极为广泛1.2 visibility 可见性 ...原创 2020-04-26 20:08:39 · 628 阅读 · 0 评论 -
CSS(八)--定位position (css学习重点之一)
定位position我们脑海应该有三种布局机制的上下顺序:标准流在最底层 (海底) -- 浮动 的盒子 在 中间层 (海面) -- 定位的盒子 在 最上层 (天空)1.定位 用来布局 定位 = 定位模式 + 边偏移1.1边偏移:通过 top、bottom、left 和 right 属性定义元素的边偏移:(方位名词)边偏移属性示例描述toptop: ...原创 2020-04-26 17:55:55 · 221 阅读 · 0 评论 -
CSS(七)--浮动(css学习重点之一)
浮动(float)1.CSS 布局的三种机制: CSS 提供了3 种机制来设置盒子的摆放位置,分别是普通流(标准流)、浮动和定位。1.1 普通流(标准流)块级元素会独占一行,从上向下顺序排列;常用元素:div、hr、p、h1~h6、ul、ol、dl、form、table行内元素会按照顺序,从左到右顺序排列,碰到父元素边缘则自动换行;常用元素:span、a、i、em等2. 浮动...原创 2020-04-26 17:26:24 · 228 阅读 · 0 评论 -
CSS(六)---盒子模型(css学习重点之一)
CSS盒子模型css学习三大重点:css 盒子模型 、浮动、定位1.盒子模型:盒子模型有元素的内容、边框(border)、内边距(padding)、和外边距(margin)组成。2.盒子边框:borderborder 分为 border-width || border-style || border-color 属性作用border-width定义边框粗细...原创 2020-04-26 16:40:19 · 234 阅读 · 0 评论 -
CSS(五)---CSS标签三种模式:display: block、inline、inline-block
CSS标签三种模式标签显示模式:display:模式;1. 三种显示模式: 块级标签(block)、行内元素(inline)、行内块元素(inline-block)2.块级标签:block常见的块元素有<h1>~<h6>、<p>、<div>、<ul>、<ol>、<li>等 其中<div>...原创 2020-04-26 15:42:57 · 574 阅读 · 0 评论 -
CSS(四)---CSS背景(background-)
CSS 背景(background)1.背景颜色(backgroung-color)语法: background-color:颜色值;颜色值和**文字颜色(color)**是一样的写法:三种表示方式。 默认的值是 transparent,意思为透明的。语法: background-color:transparent ;2. 背景图片(image)语法:background-im...原创 2020-04-26 15:18:27 · 314 阅读 · 0 评论 -
CSS(三) --- CSS外观属性:color、text-align、line-height、text-indent、text-decoration
CSS外观属性目录CSS外观属性1.color:文本颜色 1.1 color属性的表示方式2. text-align:文本水平对齐方式 3.line-height:行间距3.1 单行文本垂直居中3.2 行高和高度的三种关系4. text-indent :首行缩进5. text-decoration 文本的装饰6.总结1.color:文本颜色 ...原创 2020-04-26 14:09:55 · 816 阅读 · 0 评论 -
CSS(二)----CSS字体样式属性(font- )
CSS字体样式属性目录CSS字体样式属性1.font字体1.1 font-size :字体大小1.2 font-family: 字体 1.3 font-weight : 字体粗细 1.4 font-style :字体风格 1.5 font:综合设置字体样式2. 总结:1.font字体1.1 font-size :字体大小 ...原创 2020-04-26 12:38:17 · 564 阅读 · 0 评论 -
CSS(一) --------- CSS引入样式的三种方法、CSS基础选择器、CSS复合选择器、CSS三大特性
目录1、CSS概念和作用1.1 概念:1.2 作用:2. CSS样式表引入的三种方法?2.1行内式(内联样式)2.2 内部样式(内嵌样式)2.3 外部样式表(外链式)3. CSS基础选择器:3.1标签选择器3.2 类选择器3.3 id选择器2.3 外部样式表(外链式)4. CSS复合选择器:4.1 后代选择器:4.2 子元素选择器...原创 2020-04-26 11:08:45 · 928 阅读 · 1 评论 -
记录一下HTML的标签
可以查阅文档: W3C : http://www.w3school.com.cn/ MDN: https://developer.mozilla.org/zh-CN/目录HTML一、HTML定义为什么叫超文本呢?HTML骨架:二、HTML常用标签:1.排版标签:2.文本格式化标签3.图像标签:4.链接标签...原创 2020-04-24 20:20:30 · 640 阅读 · 0 评论