weixin_60488295的博客

项目名称：小U课堂项目描述：小U课堂是优就业打造的在线实用技能学习平台，我们要完成 首页、同步课程、视频详情、登录、注册页面等静态页面的制作项目页面（预览） 首页 列表页 详情页 其他 开发工具以及技术栈 开发工具 VScode Photoshop 主流浏览器 技术栈 利用 HTML5 + CSS3 布局 采取结构与样式相分离，模块化开发 项目规划与项目搭建

圆角属性 .box { width: 300px;height: 300px;background-color: red;/*border-radius四个角可以设置不同的圆角*/border-radius: 20px 50px 80px 100px;padding: 20px;border: 20px solid #000;}.box1 {width: 300px;height: 300px;background-color: blue..

过渡动画 css3的 transition允许css的属性值在一定的时间区间内平滑地过渡。这种效果可以在鼠标单击、获得焦点、被点击或对元 素任何改变中触发，并圆滑地以动画效果改变CSS的属性值 分别属性设置 transition -property：检索或设置对象中的参与过渡的属性transition- duration：检索或设置对象过渡的持续时间 transition -delay：检索或设置对象延迟过渡的时间 transition- timing- function：检索或设置对象中过渡的动 画类型,

CSS3简介 CSS3是最新的CSS标准。 CSS3新增选择器 属性选择器 以box开头 <style>​ div[class^="box"] {​ background:red;​ }​</style><div class="box">box</div><div class="abox">abox</div><div class="boxa">bo...

HTML5基础HTML5中新增的布局标签html 1990 html4.0.1 1997 html5 2008 稳定版 2012年新增的结构标签 （更加语义化） header标签 <header>这里是头部区</header> footer标签 <footer>这里是页脚区</footer> main标签 <main>这里是主体区</main> nav标签 <

常见的图片格式和特点格式 优点 缺点 使用场景 jpg 色彩丰富，文件小 有损压缩，反复保存图片质量下降明显 色彩丰富的图片/渐变图像 gif 文件小，支持动画、透明，兼容性比较好 只支持256种颜色 色彩简单的logo/icon/动图 png 无损压缩，支持透明，简单图片尺寸小 不支持动画，色彩丰富的图片尺寸大 logo/icon/透明图 webp 文件小，支持有损和无损压缩，支持动画、透明 浏览器..

兼容IE 浏览器常见兼容问题 兼容问题 ie中图片边框问题 图片放在a标签中 img { border:none } ie8以下浏览器中背景复合属性的写法问题 .bg { background:url("./images/bg.jpg")no-repeat center } 解决方案：在url和no-repeat 直接加上空格 .bg { background:url("./..

表单表单元素 表单元素是允许用户在表单中输入内容的标签， 比如：文本域、下拉列表、单选框、复选框等。 表单元素标签 input标签 概述：<input> 标签是最重要的表单元素。 type属性取值不同，可以展示出不同的表单形式 作用：用来定义不同种类的输入控件 语法：<input type="类型"> 常用类型9种 type="text" 作用：用于文本输..

定位定位的应用场景和基本原理定位的原理 在本文流中 , 任何一个标签都被文本流所限制了自身的位置 , 但是通过 CSS 我们依然使得这些标签可以改变 自己的位置 , 我们可以通过 float 来让标签浮动 , 我们也可以通过 margin 来让标签产生位置移动。 CSS 定位属性，允许定义标签框相对于其正常位置应该出现的位置，或者相对于父标签、 另一个标签甚至浏览器窗口本身的位置。标签可以使用顶部、底部、左侧和右侧属性定义具体的位置 position static 默认 静态定位..

浮动什么是浮动？标签的浮动是指设置了浮动属性的标签会脱离标准流的控制，移动到其父标签的指定位置浮动属性 float left right none 默认 浮动的作用 图文环绕：注意：图片和文字不会到浮动标签的下方 页面布局 浮动的宽度 浮动的宽度就是内容的宽度 浮动的问题标签浮动以后，脱离的正常文档流，导致父标签无法被撑开，会影响后续正常布局清浮动的几种方法 给浮动标签的父标签固定高度..

背景属性 background-color : red background-image: url(./img/bg.jpg) background-repeat: no-repeat background-size: 像素值或者百分比 background-position:百分比或者位置英文单词或者像素值 简写：background:red url(./img/bg.jpg) no-repeat top 标签的嵌套规则 ..

选择器进阶 群组选择器 h1, h2, h3 { background-color: yellow;text-align: center;} 选择器之间用逗号分隔 交集选择器 div.red { background-color: yellow;} 由两个以上单一选择器组成 子代选择器 ul li > a { /*子代选择器 子 指的是 亲儿子 大于号分割 此时的a 一..

day02HTML列表 无序列表 项目的列表li，自带粗体的圆点项目符号 块级标签 list-style: none; 去掉项目符号 ul>li 复合标签，ul标签的子标签必须是li标签 <ul>​• <li>HTML</li>​• <li>CSS</li>​• <li>JS</li>​...

day011.前端的概述 web的发展史 web1.0 简单的静态页面 早期三大门户 搜狐 新浪 网易 web2.0 更注重用户之间的交互 用户即是信息的消费者也是制造者 微博 web3.0 人工智能 复杂的页面功能 即时通讯 web的前景 pc端的网页 移动端的网页 ios android 2.