- 博客(15)
- 收藏
- 关注
原创 H5图标
实例: 该图标背后有放射状线条实例代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>HTML5 logo</title> <!-- <link rel="stylesheet" type="text/css" href="logo.css"> --> <style type="te..
2020-09-13 14:54:39
728
原创 天气预报图片制作
实例:实例代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Weather Forecast</title> <style > /*设置外部大盒子的背景图片,宽度,高度*/ .backimage{ margin:0 auto; width: 790px; height: 500px;
2020-09-13 14:23:15
2119
原创 DIV+CSS网页结构布局(精灵图)
实例:示例代码:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/h
2020-09-13 14:17:20
1861
原创 爱奇艺轮播图滚动
实例:实例代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>视频标签栏切换</title> <style> * {
2020-09-13 14:08:07
560
原创 7个简单进度条制作(五、六、七)
实例:实例步骤: 第一个进度条 外部创建一个盒子 内部创建一个左右边框宽度为10像素白色边框,上下边框宽度为10像素半透明白色边框,中间颜色与背景色相同的div盒子 让div盒子自转 第二个进度条外部创建一个盒子 内部创建一个5像素边框的li属性,再创建一个div盒子,使用绝对定位,将div移动到li属性上 让li属性和div盒子共同旋转实例代码:<!DOCTYPE html><html> <head> <...
2020-09-11 11:42:21
262
原创 7个简单进度条制作(四)
实例:实例步骤:外侧创建一个div盒子 内部创建一个小盒子,移动到中心位置,颜色为背景色 创建两个宽度与高度稍大于中心小盒子实例代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>progress</title> <style> body{ background-color: #808080;
2020-09-11 11:25:04
135
原创 7个简单进度条制作(三)
实例:实例步骤:创建一个外部盒子 在盒子左侧创建一个div盒子,用border-radius变成圆形实例代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>progress</title> <style> body{ background-color: #808080; } div{
2020-09-11 10:56:15
113
原创 7个简单进度条制作(二)
实例:实例步骤: 创建一个外部盒子 在外部盒子内部创建四个小盒子 在矩形条中添加相应样式和过渡属性实例代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>progress</title> <style> body{ background-color: #808080; } div{.
2020-09-11 09:40:38
112
原创 表单控件实例(含JavaScript验证
此表单控件分为含JS验证和不含JS验证(具体详情请参照表单控件实例1(不含JavaScript验证)) <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>From Validation</title> <st...
2020-04-07 17:48:28
260
原创 表单控件的实例(不含JavaScript验证)
图例:要点:使用两个嵌套盒子 表单控件的相关属性应用 左侧文字 , 右侧文本框分别左对齐相关代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>From Validation</titl...
2020-04-04 16:45:22
184
原创 利用HTML做一个课程表
↵步骤: 观察该表,建立一个14行*8列的表格 第一行合并成一个单元格 从第2行1列起,后面的每两行进行合并 添加相应的文字及背景颜色代码片段:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8...
2020-03-28 17:56:14
5880
1
原创 Transition属性的使用实例
file:///D:/Great%20Wow/Desktop/HTML%E4%BD%9C%E4%B8%9A/%E8%BF%87%E6%B8%A1%E4%B8%8E%E5%8F%98%E5%BD%A2%E7%9A%84%E7%BB%BC%E5%90%88%E5%BA%94%E7%94%A8/%E8%BF%87%E6%B8%A1%E4%B8%8E%E5%8F%98%E5%BD%A2%E7%9A%84%...
2020-03-27 10:24:19
873
原创 HTML5语义化结构标签(2)
3.页面交互元素1.details和summary元素 details元素用于描述文档或文档某个部分的细节。summary元素经常与details元素配合使用,作为details 元素的第一个子元 素,用于为details定义标题.标题是可见的,当用户点击标题时,会显示或隐藏details中的其他内容。2.progress元素 用于表示一个任务的完成进度,只...
2020-03-11 17:23:35
753
原创 HTML5语义化结构标签(1
1.结构元素Header元素 一种具有引导和导航作用的结构元素,该元素可以包含所有通常放在页面头部的内容基本格式:<header> <h1>网页主题</h1> </header>nav元素 用于定义导航链接,可将具有导航性质的链接归纳在一个区域,是页面元...
2020-03-11 15:59:49
724
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人