div对搜索引擎来说没有语义。H5新增标签语义化标签头部标签导航标签内容标签定义文档某个区域侧边栏标签尾部标签可以多次使用，建议在移动端使用视频标签尽量用MP4格式格式：属性值描述autoplayautoplay自动播放（谷歌需要加muted解决）controlscontrols向用户显示播放控件widthpx播放器宽heightpx播放器高looploop播放完是否继续，循环播放posterim

技术栈：html结构+css布局+h5c3动画目录结构：图片文件夹：img样式文件夹：css产品类图片文件：upload字体类文件夹：fonts脚本文件夹：js样式文件的分类：初始化css（cssreset

学习过程中，发现之前学习体系有遗漏，例如H5C3，Node.js，PHP，等部分。遂跟随黑马全套学习视频，把之前遗漏或者没理解

（一）transition（过渡效果）1.详解通常将css的属性值更改后，浏览器会立即更新新的样式，例如在鼠标悬停在元素上时，通过:hover选择器定义的样式会立即应用在元素上。在CSS3中加入了一项过渡功能，通过该功能您可以将元素从一种样式在指定时间内平滑的过渡到另一种样式，类似于简单的动画，但无需借助flash或JavaScript。2.属性transition-property：设置元素中参

（一）html表格看这个博主写的-----http://t.csdnimg.cn/p4Qzn写得很清楚元素定义表格行，元素定义表头，元素定义表格单元。代码示例：设置单元格之间无间隔，代码如下：table{width:100%;/*border:2pxsolid#000;*/border-spacing:0;border-collapse:collapse;}（二）colgroup和col1.作用用

(一)linear-gradient1.定义linear-gradient()函数用于创建两种或多种颜色线性渐变的图片2.方法background-image:linear-gradient(direction,color-stop1,color-stop2,...)它实际上不是颜色，而是背景图片。也就是说，它并不是color的属性值，而是background的属性值。direction:表示渐变

关于CSS的选择器:first-child和:last-child(一)我遇到的问题：在制作小米商城右侧悬浮菜单时，需要的成果图如左侧图，我做到的地方如右侧图：可以看出我做的是每个盒子外边距等间距的，而需要的结果是最后一个盒子的上边距较大。我需要对最后一个盒子进行样式调整。我看到官方代码如下：.sidebarulli:last-child{margin-top:20px;}可是在下面的html代码

1.外边距实现盒子居中对齐让一个盒子水平居中需要满足以下条件：.必须是块级元素.盒子必须设置宽度给左右外边距都设置auto就可以实现盒子水平居中.header{width:960px;margin:0auto;}2.外边距的合并（1）相邻块元素垂直外边距的合并当上下两个相邻的块元素相遇时，如果上面那个块元素设置了margin-bottom而下面那个块元素设置了margin-top，则它们两个块元素

1.为什么要清除浮动？浮动的定义：非IE浏览器下，容器不设高度且子元素浮动时，容器高度不能被内容撑开。此时，内容会溢出到容器外面影响布局。这种现象被称为浮动（溢出）。为了防止溢出，所以要清除浮动。固定格式如下：.clearfix::after{/*清除浮动*/content:"";display:block;clear:both;}2.为什么要设置内边距和外边距为0？（其实还不太清楚）默认情况下，

day011.H5新增标签头部导航栏侧边栏文章区域底部2.H5常用新属性placeholder：占位符提示信息autofocus：自动获取焦点multiple:支持多文件上传autocomplete:当提交过表单内容之后规定某个表单控件的提示内容关闭和打开required:必填项tabindex:指定表单控件获取焦点的顺序用户名：密码：手机号：邮箱：日期：文件：3.input新增type类型ema

1、常用的新语义标签：headernavmainasidesectionarticlefooter等。所有的浏览器都支持main标签，只有ie不支持，开发时不能使用main标签。移动端的浏览器兼容性比较好，不用考虑兼容性问题，所有新标签都能使用。2、h5标签在ie8是显示不出来的，但如果由js动态创建的，就可以显示。html5shiv.js默认帮我们处理了ie8的兼容性问题，原理就是使用js来创建

1-私有前缀谷歌、苹果浏览器：-webkit--webkit-transform:rotate(45deg);火狐浏览器：-moz--moz-transform:rotate(45deg);IE浏览器：-ms--ms-transform:rotate(45deg);欧朋浏览器：-o--o-transform:rotate(45deg);2-元素选择器idid选择器class类选择器标签标签选择器*

目录H5C3和Html，css相比有什么变化Html5新增特性CSS3新特性标签元素分类和特点行内元素spanbstronguinsdel…块状元素divph1-h6headerfooter…行内块元素

H5C3H5C3和Html，css相比有什么变化H5新特性：拖拽释放(Drapanddrop)APIondrop拖放是一种常见的特性，即抓取对象以后拖到另一个位置。在HTML5中，拖放是标准的一部分，任何元素都能够拖放。自定义属性data-id语义化更好的内容标签(header,nav,footer,aside,article,section)音频,视频(audio,video)如果浏览器不支持自

目录1、rem和em的区别2、如何关闭IOS键盘首字母自动大写3、什么是语义化标签4、::before和:after中双冒号和单冒号有什么区别？解释一下这2个伪元素的作用。5、ios系统中元素被触摸时产生的半透明灰色遮罩怎么去掉6、：webkit表单输入框placeholder的颜色值能改变吗？7、禁止ios长按时触发系统的菜单，禁止ios&android长按时下载图片8、禁止ios和androi

HTML+CSS1.说一下css的盒模型在HTML页面中的所有元素都可以看成是一个盒子盒模型的组成：是由内容、内边距、边框、外边距组成的盒模型的类型：标准盒模型margin+border+padding+contentIE盒模型margin+content（border+padding）box-sizing:content-box(默认值，标准盒模型)、border-box（IE盒模型）2.CSS

本篇内容主要是PINK老师教程汇总（主要内容如下）1.web端布局：先讲解HTML5常用标签，接着讲解CSS3常见样式增加的H5C3新特性，新语法，最后讲解PC端品优购项目。

H5C3新特性标签.属性.操作DOM的方法querySelectAll.document.getElementByClassNamehistory.go(n)拖拽事件等事件委托原理事件冒泡→动态生成标签问题普通的事件冒泡和事件绑定区别

HTML5基础CSS3基础H5C3提高项目实战1.1.HTML导读能够说出网页的基本组成能够说出什么是HTML能够说出常用的浏览器能够说出Web标准的三大组成部分1.1.1网页:网页的相关概念什么是网页

语义化标签头部标签导航标签内容标签定义文档某个区域侧边栏标签尾部标签多媒体标签video音频标签-audio1.音频标签和视频标签使用方式基本一致2.浏览器支持情况不同3.谷歌浏览器把音频和视频自动播放禁止了4.我们可以给视频标签添加muted属性来静音播放视频，音频不可以（可以通过JavaScript解决）5.视频标签是重点，我们经常设置自动播放，不使用controls控件，循环和设置大小属性新

H5C3H5C3和Html，css相比有什么变化HTML5中的一些有趣的新特性：用于绘画的canvas元素用于媒介回放的video和audio元素对本地离线存储的更好的支持新的特殊内容元素，比如article、footer、header、nav、section新的表单控件，比如calendar、date、time、email、url、search基本选择器属性选择器伪类选择器CSS3边框与圆角CS

目录0.WEB标准构成1.HTML1.1HTML概念1.2超文本含义1.3页面语言1.4字符集1.5标签语义化1.6常用标签1.7图像标签img1.8链接标签1.9锚点定位1.10base标签1.11特殊字符1.12XHTML1.13HTML和XHTML之间的区别1.14表格1.14.1表格属性1.14.2表头单元格标签th1.14.3表格标题-caption1.14.4合并单元格1.14.5表格

八、H5C3模块基础部分1.CSS3有哪些新特性？

前段时间因为一些事情耽误确实这个事情苦恼了我很久我第一次感受到就是我很想十分努力的去学习去改变自己但是一种力不从心的感觉一种不给你机会的感觉如果后面有机会我会专门发一篇随笔来写这几个月我在干嘛还真是讽刺前面才说梦开始的地方结果就戛然而止了哈哈哈现在回来了回来过后先是开始复习我觉得所以这几天都在复习两天时间就把h5c3

H5C3新特性简单总结CSS3新特性：1.颜色：新增RGBA，HSLA模式2.文字阴影（text-shadow）3.边框：圆角（border-radius）边框阴影：box-shadow4.盒子模型：box-sizing5

1.HTML/CSS/H5C3知识点1.1鼠标样式|十字|1.2css半透明样式1.3CSS3transform属性1.3.1旋转1.3.2缩放1.4特殊写法\91.5解决video标签在谷歌不能自动播放

定位堆叠顺序在使用定位布局的时候，可能会出现盒子重叠的情况。此时，可以使用z-index来控制盒子的前后持续。（参考为坐标轴的Z轴）语法：选择器{z-index:1;}注意细节：数字可以是正整数、负整数或是0，默认为auto。数字越大，盒子越靠山。如果属性值相同，则按照书写顺序，后来居上。数字后面不加单位。（表示等级的意思）只有定位的盒子才有z-index属性代码示例：定位的堆叠顺序.box{po

CSS3中新增了盒子阴影，我们可以使用box-shadow属性为盒子添加阴影。语法：box-shadow:h-shadowv-shadowblurspreadcolorinset;值描述h-shadow必须。水平阴影的位置。允许负值。v-shadow必须。锤子阴影的位置。允许负值。blur可选。模糊距离。spread可选。阴影的尺寸。color可选。阴影的颜色。inset可选。将外部阴影（outs

类似于网站广告，点击关闭就不见了，刷新页面会重新出现。本质：让一个元素在页面中隐藏或者显示出来。display属性display属性用于设置一个元素如何显示代码作用display:none;隐藏对象display:block;除了转换为块级元素之外，同时还有显示元素的意思。注意细节：display隐藏元素之后，不再占有原来的位置。搭配JS可以做很多的网页特效。visibility可见性visibi

api：H5C3：page{background-color:#f3f4f6;}.uni-input-placeholder{font-size:26rpx;line-height:30rpx;padding-bottom

前段时间因为一些事情耽误确实这个事情苦恼了我很久我第一次感受到就是我很想十分努力的去学习去改变自己但是一种力不从心的感觉一种不给你机会的感觉如果后面有机会我会专门发一篇随笔来写这几个月我在干嘛还真是讽刺前面才说梦开始的地方结果就戛然而止了哈哈哈现在回来了回来过后先是开始复习我觉得所以这几天都在复习两天时间就把h5c3

第一天H5学习新的标签名Documentheader{height:100px;background-color:#ddd;}main{height:300px;width:80%;background-color:blueviolet;margin:0auto;}footer{height:100px;background-color:brown;}section{width:50%;heigh

语义化标签：header、footer、section、nav、aside、article增强型表单：input的多个typeFirstname:Lastname:新增表单元素：datalist、keygen、outputoutput:0100+=datalist:keygen:用户名:加密:用户名:加密:新增表单属性：placehoder、min和max音频视频：audio、videocanva

1.0.HTML5学习目标：了解H5新变化掌握H5新增语义化标签掌握H5新增多媒体标签掌握H5新增input表单、表单属性HTML5介绍：HTML5就是HTML版本的第五次重大修改，目的为了适用移动端的发展版本：HTML4–XHTML–HTML5HTML5前景移动端优先广义的HTML5是HTML5本身+CSS3+JavaScript1.1.语义化标签了解使用语义化标签的好处是增强了代码的可阅读性，

目录1.div水平垂直居中的方法2.常见定位方案，BFC概念3.opacity、visibility、display优劣4.覆盖元素宽度的方法5.移动端1px边框问题6.[‘1’,‘2’,‘3’].map(parseInt)7.防抖节流8.javascript执行机制9.cookie和token10.CSS3新特性？HTML5新特性？语义化？11.知道css的content属性吗？有什么应用？清除

3D转换认识3D转换3D的特点近大远小物体和面遮挡不可见三维坐标系x轴：水平向右–注意：x轴右边是正值，左边是负值y轴：垂直向下–注意：y轴下面是正值，上面是负值z轴：垂直屏幕–注意：往外边的是正值，往里面的是负值3D转换3D转换知识要点3D位移：translate3d(x,y,z)3D旋转：rotate3d(x,y,z)透视：perspctive3D呈现transfrom-style3D移动tr

H5C3新特性h51.语义化标签header、footer、aside、section、article、nav2.表单输入类型email、url、number、range、DatePickers、search

H5C3新增特性html5新标签与特性css3新增属性选择器及伪类选择器属性选择器伪类选择器css3新增文本样式文字阴影文字描边渐变线性渐变径向渐变网络字体边框属性border-radius边框圆角box-shadow

目录1.按照设计稿写的1920px，实际完成后全屏之下却出现了滚动条2.固定头部标题栏及左侧边栏头部的一些注意事项3.左侧边栏实现固定高度，多余部分向下滚动，并隐藏滚动条的效果4.时间选择器：输入框+按钮结合的一些设计细节5.表格实现表体高度固定、表身滚动的效果，常见的表格样式设置6.鼠标移动后按钮发生位置偏移、text-align“失效”、中英文括号7.layui-date的使用、第三方插件的样

我们可以使用H5C3的新属性来实现无缝轮播图，首先创建动画，然后使用动画属性，在将要轮播的图片复制一份，这样就可以实现图片的无缝轮播，但是这样实现有一个缺点那就是需要加载的图片更多了*{padding:

zh-CN,en-US是语言代码更多语言代码，请查看http://www.lingoes.cn/zh/translator/langcode.htm转载于:https://www.cnblogs.com/h5c3

第一阶段：移动web网页开发核心知识点•CSS32D•CSS33D变换•CSS3animation动画•H5C3炫酷页面开发•Flex伸缩布局•移动端主流适配方案•常见移动端样式兼容方案•预处理器Less

H5C3基础一、HTML5的新特性1.1HTML5新增的语义化标签1.2HTML5新增的多媒体标签①视频②音频1.3HTML5新增的input类型1.4HTML5新增的表单属性二、CSS3的新特性2.1

HTML5超文本标签语言:用文本来表示带有特殊标签的语言对html5语义化标签的理解标签具有语义的意义有利更好呈现代码结构便于SEO:SearchEngineOptimization搜索引擎优化提升用户体验:[eg:label标签:获取光标焦点]便于团队开发维护:更具可读性方便其他设备解析---[可省略]H5在客户端储存数据的新方法localStorage--没有时间限制的数据储存sessionS

实现动画，css3实现动画）一个是帧动画一个是补间动画什么是帧动画：使用定时器每隔一段时间更改当前元素的状态什么是补间动画：过渡(加过渡只要状态发生改变产出动画)动画（多个节点来控制动画）性能会更好在支持H5C3

案例：实现步骤1.搭建HTML结构里面的6个div分别是6个狗狗图片注意最终旋转是section标签旋转2.CSS样式1>给body添加透视效果perspective:1000px;2>给section添加大小，一定不要忘记添加3d呈现效果控制里面的6个div3>别忘记子绝父相，section要加相对定位4>里面6个div全部绝对定位叠到一起，然后移动不同角度旋转和距离注意：旋转角度用rotate

、CSS实现动画的区别：JS:帧动画CSS:补间动画帧动画:使用定时器每隔一段时间更改当前元素的状态补间动画:通过过渡(只要状态发生改变产出动画)产生动画(多个节点来控制动画),性能会更好注意：在支持H5C3

《购物车宣传》案例综合运用h5c3知识且进行一定扩展能使用jquery完成网页常见交互行为实际工作开发当中能应对活动宣传页全屏切换效果通过鼠标的滚轮切换全屏页面使用fullpage来完成使用动画（js实现动画

H5C3一HTML5HTML5的概念与定义定义：HTML5定义了HTML标准的最新版本，是对HTML的第五次重大修改，号称下一代的HTML概念：是一个新版本的HTML语言，定义了新的标签、特性和属性拥有一个强大的技术集

H5C3、JQ、JS、vue、小程序。在工作中，是能够解决问题，但对于问题也只是一知半解，是个前端小白。现在回过头来，从基础学起，将学习历程写为随笔，若有人看到。希望指出错误，不吝赐教，指导我进步。