![](https://img-blog.csdnimg.cn/20201027085851413.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
HTML5 和 CSS3
以学习笔记为主,创建项目雏形
蔡大爷的小甜心
慢慢来吧,慢慢约会吧。
展开
-
day-13、14 移动端页面、导航条响应
移动端页面、导航条响应移动端页面导航条响应移动端页面导航条响应原创 2020-11-12 15:35:00 · 176 阅读 · 1 评论 -
day12-像素、视口、vw
像素、视口、vw像素像素手机像素视口视口完美视口vwvw单位vw适配像素像素屏幕是由一个一个发光的小点构成,这一个个的小点就是像素;分辨率说的就是屏幕中小点的数量;在前端开发中像素要分成两种情况讨论:CSS像素、物理像素;物理像素: 上述所说的小点就是物理像素;CSS像素: 编写网页时,我们所用的像素就是CSS像素;-浏览器在显示网页时,需要将CSS像素转换为物理像素然后呈现;-一个CSS像素最终由几个物理像素显示由浏览器决定;默认情况下在PC端,一个CSS像素=一个物理像素;手机像原创 2020-11-07 10:30:11 · 224 阅读 · 2 评论 -
day12-弹性盒子
弹性盒子flex(弹性盒子、伸缩盒子)弹性容器弹性元素弹性元素属性弹性容器上的样式flex-wrapflex-flowjustify-contentalign-itemsalign-contentalign-self弹性元素上的样式flex-growflex-shinkflex-basisflexorderflex(弹性盒子、伸缩盒子)是CSS中的又一个布局手段,主要用来代替浮动元素来完成页面的布局;flex可使元素只有弹性,让元素可以跟随页面的大小改变而改变;弹性容器要使用弹性元素必须先讲一原创 2020-11-07 10:27:20 · 146 阅读 · 0 评论 -
day10-练习(过渡、动画、旋转)
练习米兔练习米兔练习原创 2020-11-05 09:20:33 · 363 阅读 · 1 评论 -
day10-CSS 03
CSS03过渡transitiontransition-propertytransition-durationtransition-timing-functiontransition-delay过渡transition通过过渡可以指定一个属性发展变化时的切换方式;通过过渡可以创建一些非常好的效果,提升用户的体验;可同时设置过渡相关的所有属性,只有一个要求就是,如果要写延时,则两个时间第一个是持续时间,第二个是延时;transition-property指定要执行过渡的属性;多个属性间使用原创 2020-11-04 21:18:16 · 138 阅读 · 0 评论 -
day-08、09 项目搭建(小米官网)
项目搭建(小米官网)原创 2020-11-03 21:38:59 · 545 阅读 · 0 评论 -
day07-HTML 02
HTML 02表格表单文本框提交按钮普通按钮重置按钮密码框单选按钮多选框下拉列表自动补全readonlydisabledautofocus表格在网页中,表格通过使用 table 标签来创建一个表格;在table中使用 tr 表示表格中的行;在tr中使用 td 表示行中的单元格;colspan 横向合并单元格;rowspan 纵向合并单元格;borderspcing 指定边距的距离;==border-collapse: collapse;==设置边框的合并;注意:如果表格中没有使用tb原创 2020-11-02 11:03:54 · 61 阅读 · 0 评论 -
day06-背景练习
背景练习原创 2020-11-01 20:27:32 · 77 阅读 · 0 评论 -
day05-导航条及下拉框练习
导航条及下拉框练习原创 2020-11-01 19:26:36 · 179 阅读 · 0 评论 -
day06-背景
背景原创 2020-11-01 17:25:03 · 83 阅读 · 0 评论 -
day04-轮播图练习
轮播图练习轮播图练习轮播图练习图片从官网自行下载添加,这里采用的是将图片放在与本.html的同级文件夹下,名称分别设置为 0401.png 、0402.png 、0403.png、0405.png、0406.png、0407.jpg、0408.png本文是在引用了reset.css文件去除浏览器默认样式的情况下进行的渲染,可参考day02-layout盒模型中浏览器的默认样式模块下的reset.css链接自行下载使用<!DOCTYPE html><html lang="en"原创 2020-10-31 20:06:41 · 134 阅读 · 0 评论 -
day05-CSS3 02
CSS3 02行高(line height)字体相关属性(font)font-sizefont-weightfont-style文本文本的水平对齐(text-align)文本的垂直对齐(vertical-align)其它文字的样式text-decoration 设置文本修饰white-space 设置网页如何处理空白行高(line height)指文字占有的实际高度,可以将行高设置为和高度一样的值,使单行文字在元素中垂直居中;可以通过line height来设置行高,也可以直接指定一个大小(px原创 2020-10-31 18:05:03 · 802 阅读 · 0 评论 -
day03-layout 定位、层级、字体、图标字体
layout 定位、字体定位相对定位绝对定位绝对定位布局固定定位粘滞定位元素的层级字体图标字体定位相对定位绝对定位绝对定位布局固定定位粘滞定位元素的层级字体图标字体原创 2020-10-31 15:46:41 · 399 阅读 · 0 评论 -
day03-layout 盒子、浮动
layout盒模型原创 2020-10-29 21:52:41 · 124 阅读 · 0 评论 -
day03-布置练习
布置练习原创 2020-10-29 17:08:51 · 154 阅读 · 0 评论 -
day02-layout盒模型
盒模型原创 2020-10-28 17:33:30 · 226 阅读 · 0 评论 -
day02-layout文档流
layout文档流盒模型文档流盒模型原创 2020-10-28 13:50:44 · 95 阅读 · 0 评论 -
day02-CSS3
CSS前情提要前情提要CSS餐厅练习原创 2020-10-28 13:20:16 · 104 阅读 · 0 评论 -
day01-HTML
HTML前情提要软件分类可分为又分为工具下载网页开发标准HTML标准结构快捷键HTML标签HTML元素块元素行内元素HTML属性HTML实体前情提要软件分类可分为 系统软件 应用软件 游戏软件又分为客户端 形式: -文字客户端(命令行) -图像化客户端[C/S架构](点击拖动) -网页[B/S架构](浏览器访问网页) -无需安装 -无需更新 -跨平台服务器(负责远程处理业务逻辑) 服务器的开发语言: java(最原创 2020-10-27 16:10:34 · 202 阅读 · 1 评论