caicai16的博客

功能性语义化标签 hgroup标签:一个标题和一个子标题,或者标语的组合** PS:可使用的浏览器 IE 9、Firefox、Opera、Chrome 和 Safari 支持 标签。 注意：IE 8 或更早版本的 IE 浏览器不支持 标签 使用在对网页或区段（section）的标题进行组合 效果图如下 figure标签:用户对元素进行组合,一般用于图片或视频 PS: 可使用的浏览器...

注意点 1.head: 引入公共样式，新建css文件写入：common.css 2.书写公共样式： < rel=“icon” >把图标插入网页标题 < rel=“shortcut icon” >在收藏夹里显示图标，提高用户体验 < type= “image/x-icon” 引入图片类型> （1）link rel=" icon" href=“favicon. i...

补充知识点： 锚点链接：a标签和id选择器的使用（使用在右侧导航栏） 2.高仿轮播 3.复习知识点： 盲点： 样式优先级： 层级由低到高： 通配符（关系选择器权重为0）＜标签选择器（伪元素权重为1）＜伪类选择器（类名，属性选择器权重为10）＜id选择器权重为100＜行内元素权重1000＜!important 属性选择器：伪类选择器之属性选择器 行内元素：不占一行，不可以设置宽高，上下边距以及aut...

新知识： 响应试布局：一个网站可以兼容多个终端（bootstrap） （1）优点： 1）面对不同的分辨率时，设备的灵活性较强 2）能够快捷的解决在多个设备上适应的问题 3）使用在中小型网站 （2）缺点： 1）为了兼容多个设备，工作量较大，效率不高 2）代码冗余，有很多隐藏无意义的元素，加载速率不会很快 （3）原理：通过css新增的媒体查询，同过匹配不同宽度达到不同的显示效果 （4）媒体查询：能够检...

学习测试感悟: 在audio中的autoplay自动播放。但谷歌默认禁止自动播放 1.新知识：弹性盒模型 1）原因：使得用户体验更加好，以及布局的整体效果随着用户的缩放来定 昵称：flex 2）概念：父元素（容器） 父元素：有两个轴（主轴和交叉轴） 3）设置格式：父级：display:flex; 4）主轴方向（决定元素的排布顺序）： row默认值：左从到右 row-reverse右＿左 colum...

1.新知识 （1）阿里图标 阿里图标第一种:Unicode用法 Unicode 是字体在网页端最原始的应用方式，特点是： 兼容性最好，支持 IE6+，及所有现代浏览器。 支持按字体的方式去动态调整图标大小，颜色等等。 但是因为是字体，所以不支持多色。只能使用平台里单色的图标，就算项目里有多色图标也会自动去色。 注意：新版 iconfont 支持多色图标，这些多色图标在 Unicode 模式下将不能...

3D补充知识点： 滤镜样式 主要应用在图片上比较多 filter 取值： 1）none（没有） 2）blur（px）高斯模糊，值越大越模糊，不接受百分比 3）brightness（%）亮度，100%不变，0%全黑。超过100%会越来越亮 4）contrast（%）对比度100%默认，0%全灰，超过100%对比度越高。没有负值 5）drop-shadow 水平偏移 垂直偏移 模糊距离（blur） 模...

1.测试题练习 （1）怎么让Chrome支持小于12px的文字 （2）介绍一下标准的css盒模型与低版本IE的盒子模型有何区别 （3）img的alt与title有何区别。strong与em有何区别 （4）简述一下src与href的区别 （5）display:none;与visibilite:hidden;的区别 2.新知识 （1）3D制作 给父级添加： 开辟异次元空间：transform-styl...

1.作业讲解 注意动画是只设置第一帧和最后一帧 2.新知识 transform变化 取值： （1）角度：rotate（多少deg）元素中心点顺时针旋转 （2）位移translate（x，y） 分开：translateY translateX （3）放大或缩小：scale（x，y） scaleX scaleY 取值为负数则是进翻转 （4）倾斜角度skew（x，y） 在中心点进行倾斜角度 取值：(多少...

今日份测试： （1）em是指根据父级的字数的倍数 （2）时间不充裕？挤出来 新知识： 动画 （1）什么是动画 （2）触发式动画 （3）主动式动画 动画就是由一个一个的关键帧组成的; 触发式动画： 1）时间参数，执行多久：transition-duration 2）延迟执行时间：transition-delay 3）速率（过渡动画时间参数）transition-timing-function： 取值...

1.高级选择器（伪类） 种类： （1）状态类选择器 1）～4）顺序必须记住：爱恨准则love hate（lv ha） 1）未访问状态：link 2）已访问状态visited 3）鼠标移动到链接上：hover 4）选定的链接（在鼠标按下去但是没有松手的时候的状态）：active 5）checked改变被选中的状态，常使用在表单中的input 6）focus表单聚焦时的状态 （2）结构类 括号去取值：...

1.测试 注意： （1）input属于行内替换元素 （2）img属于行内元素，并且可以设置宽高 （3）input中的name是为了提交数据 （4）label标签中的for属性是为了和表单中input标签的id绑定 （5）表单中form提交的方式的区别post安全性高，但是get储量小，不安全。 2.新知识：表格元素与表格布局解析 （1）盒子table （2）边框分隔： border-collaps...

复习表单 注意： （1）需要提交才要加form （2）可以添加任何的样式 （3）清除input的边框：border:none; 清除选中时显示的边缘线：outline:none; （4）鼠标样式：cursor pointer小手，代表可以点击 不会找W3C（万维网联盟。制定网络标准，如html，css等，祖师爷：蒂姆-博纳斯-李） （5）实战王者荣耀下拉导航栏 ...

测试的时候注意的点： 注意： 区别隐藏与显示 visibility:hidden; 占据位置，隐藏元素 overflow:hidden; 不占据位置，隐藏元素 二.学习的 新知识： 表单：申请 form作用：数据提交 1.属性： （1）提交方式：method（get提交不安全，因为信息全部会暴露/post安全性高） （2）注意：你的提交方式你的后端会告诉你的 （3）name 写当前的内容表示的是什...

学习心得 浮动样式：脱离标准文档流 （1）缘由：实现文本环绕的效果 （2）布局位置： 从左到右：float:left; 从右到左：float:right; （2）好处：不会产生解析空格，默认顶端对齐，并且同排显示 注意：布局不要指局限于当前所学的 （3）浮动延申：解决父级塌陷问题： 1）让父级BFC化，即给父级设置： overflow:hidden; display:inline-block; f...

学习心得: 1.测试： 注意：border-radius的最大值不能超过边长 2.作业讲解： 文字加粗：font-weight:bold;/bolder（加粗） 取值：100－900 背景图片居中：position:center/像数值 auto 3.学习新知识 4.定位：position 注意：会脱离标准文档流 （1）绝对定位：相对浏览器窗口来定位，完全脱离标准文档流 （2）相对定位：相对于初始...

学习方法：每个ppt敲三遍，但是需要提前看两边先敲，再自己理解敲一遍。 注意点： 1）vertical-align是指跟线对齐，如果设置了像素值则是会在页面放大或缩小的时候影响布局 2）相邻选择器+ 3）背景复合样式 ...

圆角属性的学习心得 测试注意点： 如何做到元素的显示与隐藏（元素位置保留） opacity：0； opacity：1； 如何做到元素的显示与隐藏（不保留元素位置） display:block； display:none; 新知识： 圆角样式与渐变色 1.圆角样式 （1）格式：border-radius 取值： 一个值：相当于四个角的取值 两个值：对角线（左上右下 右上左下） 三个值：左上 右上左下...

（1）作业布局思路： 先结构～样式～内容（从外到里设置样式） （2）案例实践复习：小米官网 使用已经掌握的知识实战小米官网 1）企业级命名规范 2）外联样式命名要一样 3）使用div，以及id进行每一块的唯一性 ...

1.作业注意点： 一行文字给p标签。 img需要给边距可以给个父级div 注意点： 2.测试易错点:alt与title的区别 alt是指图片显示不出来时，替换图片（描述图片的内容） title是鼠标悬浮的时候出现的效果 3.默认显示类型与显示类型的转化 （1）概念：显示类型：display 块级元素默认显示类型：block 行内元素：inline 行内块：inline-block 使用行内块但是会...

行内盒模型的学习 1.概念：是W3C规定一个浏览器如何渲染，显示，排版文字的一整套规则 2.文本对齐方式 （1）行内盒模型的内容区由字体大小决定的 padding:左右生效，上下无效 margin:左右生效，上下无效，但是居中无效（注意） 字体：font-size，单位：em（父级的倍数增加），px （2）文本线 基线baseline 由该字体中的X的小写字母的底线决定 （3）字体样式：font-...

学习心得 1.盒模型的概念是: 根据元素的种类分为块级元素盒模型和行内盒模型 2.盒模型的一些样式： （1）内容 （2）padding （3）border 边框：粗细 样式（实线solid，点dotted，双实线double，虚线dashed）颜色（color） 边框复合属性：border:1px solid red； transparent透明色 根据方向分开： border-top borde...

谭州课堂基础班学习第一天 跟着sherry大佬学习，新的开始新的起程，加油。 开课第一天： 1.老师介绍潭州课堂的历史 2.讲解内容 （1）什么是前端：主要是完成基于浏览器用户界面设计和开发，主要工作有PC网站开发，Webapp开发，在线开发，本地软件开发 （2）前端三把斧：html：网页内容的展示（文字，视频，图片）+css：内容的装饰+js（javascript内容的交互：注册，登录，点击……...