做书app下载网站有哪些,百度快照投诉中心官网,公司网站备案材料,怎么得到wordpress文章加图片目录
1 前言和要求
1.1 前言
1.2 设计要求
2 预览
2.1 主页页面
2.2 个人简介
2.3 个人爱好
2.4 个人成绩有代码#xff0c;但是图片已省略#xff0c;可以根据自己情况添加
2.5 收藏夹
3 代码实现
3.1 主页
3.2 个人简介
3.3 个人爱好
3.4 个人成绩#xff…目录
1 前言和要求
1.1 前言
1.2 设计要求
2 预览
2.1 主页页面
2.2 个人简介
2.3 个人爱好
2.4 个人成绩有代码但是图片已省略可以根据自己情况添加
2.5 收藏夹
3 代码实现
3.1 主页
3.2 个人简介
3.3 个人爱好
3.4 个人成绩根据自己的情况添加
3.5 收藏夹
4 可能要用的图片其他根据自己情况选或者全部自己找新的
4.1 主页
4.2 个人简介 4.3 收藏夹 1 前言和要求
1.1 前言 如果有些东西css样式看不懂的话可以去编程宝库或者菜鸟教程查找相应的知识另外作为业余选手因为不是专业的做的前端网页是有一些毛病的必须在全屏下效果才好浏览器大小变化的话会有一点问题。
1.2 设计要求
1结构要求主页和二级页面美观至少2段以上文字介绍自己至少3个二级页面主页超链接进入至少3张图片有背景音乐。
2内容要求个人自序、个人爱好、个人成绩、收藏夹网上好的文章或诗词等的链接等部分。
3技术要求网页美观内容丰富浏览方便界面友好使用的HTML标签/样式及其JavaScript特效。
2 预览
2.1 主页页面 2.2 个人简介 2.3 个人爱好 2.4 个人成绩有代码但是图片已省略可以根据自己情况添加
2.5 收藏夹 3 代码实现
3.1 主页
!DOCTYPE html
html langenheadmeta charsetUTF-8titleWX的主页/titlestylebody{/*background-color:#11BBEE;*//*background-color: #33d3d3;*/margin:0px;background-image:url(picture/15.jpg);background-size:100% 100%;background-attachment: fixed;/*background-image-z-index: -1;*/background-repeat:no-repeat;}h1{text-align:center;}div.a{float:left;position:relative;left:50%;}div.b {position: relative;left: -50%;}.center {margin: auto;width: 50%;}p{font-size: 20px;}/style/headbodyaudio controls autoplay loop idvd styledisplay: inlinesource srcmusic/love.mp3 typeaudio/mpeg您的浏览器不支持 audio 元素。/audioh1 styletext-align:center;margin-top:0;WX的主页/h1div styleborder-style: dashed;border-color: #00ccff;clear: both/divdiv classa stylemargin-top: 25pxdiv classb stylediv styletext-align: centera hrefhomework8.1.htmlimg srcpicture/20.jpg styleborder-radius:50%;width: 100px;height: 100px;/aa hrefhomework8.2.htmlimg srcpicture/23.jpg styleborder-radius:50%;width: 100px;height: 100px;margin-left: 50px/aa hrefhomework8.3.htmlimg srcpicture/24.jpg styleborder-radius:50%;width: 100px;height: 100px;margin-left: 50px/aa hrefhomework8.4.htmlimg srcpicture/25.jpg styleborder-radius:50%;width: 100px;height: 100px;margin-left: 50px/abr /p styledisplay:inline;margin-left: -8px;个人简介/pp styledisplay:inline;margin-left: 70px;个人爱好/pp styledisplay:inline;margin-left: 70px;个人成绩/pp styledisplay:inline;margin-left: 82px;收藏夹/pp stylecolor: green;margin-top:5%;font-size: 22px;点击对应图片即可跳转/ptable styletrtd stylewidth: 400pxp styledisplay:inline;margin-left:-100px;color: red;text-shadow:2px 0px #43798d;font-size: 25px梦想与现实之间的距离叫行动/pp stylefont-family:Times New Roman;margin-left:-100px;color: red;font-style:italic;text-shadow:2px 0px #43798d;font-size: 25pxThe distance between a dream and a reality is called action/p/td/trtrtd stylewidth: 400pxp styledisplay:inline;color: blue;margin-left:-500px;text-shadow:2px 0px #43798d;font-size: 25px减少期待调整心态/pp stylefont-family:Times New Roman;margin-left:-500px;color: blue;font-style:italic;text-shadow:2px 0px #43798d;font-size: 25pxReduce expectations and adjust your mindset/p/td/tr/table/div/div/div/body
/html
3.2 个人简介
!DOCTYPE html
html langenheadmeta charsetutf-8title个人自序/titlestylebody {margin: 0;}ul {list-style-type: none;margin: 0;padding: 0;width: 15%;background-color: #f1f1f1;position: fixed;height: 100%;overflow: auto;}li a {display: block;color: #000;padding: 8px 16px;text-decoration: none;}li a.active {background-color: #4CAF50;color: white;}li a:hover:not(.active) {background-color: #555;color: white;}body{margin: 0;background-image:url(picture/17.jpg);background-size:100% 100%;background-attachment: fixed;background-repeat:no-repeat;}td{padding:10px;}p{font-size: 18px;}/style/headbodyul styletext-align: center;background-color: #267F88FFliimg srcpicture/12.jpg stylemargin:30px 0px 30px;width:55%;border-radius:50%;border:8px solid #210a42;/lilia hrefhomework8.htmlp stylefont-size: 18px;color: white主页/p/a/lilia href#infop stylefont-size: 18px;color: white基本信息/p/a/lilia href#resumep stylefont-size: 18px;color: white个人简介/p/a/lilia href#skillp stylefont-size: 18px;color: white技能/p/a/lilia href#dreamp stylefont-size: 18px;color: white梦想/p/a/li/uldiv idinfo stylemargin-left:15%;padding:1px 16px;a hrefjavascript:history.back(-1) styletext-decoration: none;p stylefont-size: 22px;display: inline返回上一页/p/ah1 styletext-align: center;基本信息/h1table stylewidth: 90%;trtdp性别男/p/tdtdp年龄19/p/tdtdp家乡xxxx/p/td/trtrtd stylewidth: 350pxp博客https://blog.csdn.net/qq_63306482/p/tdtd stylewidth: 250pxp邮箱2761646008qq.com/p/tdtd stylewidth: 150pxp专业物联网工程/p/td/trtrtdp高中xxxxx中学/p/tdtdp大学湖南科技大学/p/tdtdp学历本科在读/p/td/tr/tableimg srcpicture/19.jpg stylemargin-left: 200px;border-radius:50%;/divdiv idresume stylemargin-left:15%;br / br / br / br / br /br /br /h1 styletext-align: center;个人简介/h1div stylemargin:0 15% 0 10% p stylepadding: 20pxemsp;emsp;本科在读小学生来自xxxxxxx地。一般程度爱好学习平时上课的时候比较积极一般不是坐在第一排至少也是坐在前几排注意力集中喜欢积极和老师互动回答老师的问题但是在课后的时候一般就没怎么去复习或者学习了导致临近考试时经常要花很多时间去复习。br /emsp;emsp;大一的时候除了学习了课本的内容并没有涉及过其他的知识是一个啥也不会的小学生所以大二这一年决定去多涉及一点课外的知识刚好也加入了学院微科基地的工作室可以有一些机会和小组成员去做一些项目锻炼一下自己提升一下自己的动手能力。br /emsp;emsp;平常放松的方式有篮球、羽毛球、乒乓球和听歌没事的时候喜欢去操场跑跑步骑单车去学校周围的公园、景点或者湘江边转转。这些方式都可以让自己在一天的忙碌中得到短暂的享受也可以减轻自己的心理压力。br /emsp;emsp;另外性格方面属于xxxxxxxxxx随便写点。/p/div/divbr / br / br / br / br / br /br /div idskill stylemargin-left:15%;br /h1 styletext-align: center;技能/h1div stylemargin:0 15% 0 10%;h3课程内所学技能/h3a hrefhttps://www.runoob.com/cprogramming/c-tutorial.html target_blankimg srcpicture/3.png styleborder-radius:50%;width: 200px;height: 150px;margin-left: 50px/aa hrefhttps://www.runoob.com/java/mysql-tutorial.html target_blankimg srcpicture/mysql.jpg styleborder-radius:50%;width: 130px;height: 120px;margin-left: 80px/aa hrefhttps://www.runoob.com/java/java-tutorial.html target_blankimg srcpicture/java.jpg styleborder-radius:50%;width: 130px;height: 120px;margin-left: 130px/abr /br /p styledisplay: inline;margin-left: 120pxC语言/pp styledisplay: inline;margin-left: 200pxMySQL/pp styledisplay: inline;margin-left: 215pxJAVA/pbr /br /a hrefhttps://www.runoob.com/html/html-tutorial.html target_blankimg srcpicture/htm.png stylemargin-left: 85px/aa hrefhttps://www.runoob.com/css/css-tutorial.html target_blankimg srcpicture/css.png styleborder-radius:50%;width: 130px;height: 120px;margin-left: 120px/aa hrefhttps://www.runoob.com/js/js-tutorial.html target_blankimg srcpicture/js.png styleborder-radius:50%;width: 130px;height: 120px;margin-left: 130px/abr /br /p styledisplay: inline;margin-left: 110pxhtml语言/pp styledisplay: inline;margin-left: 182pxCSS样式/pp styledisplay: inline;margin-left: 190pxJavaScript/pbr /br /h3课外所学技能/h3a hrefhttps://www.zhihu.com/tardis/zm/art/549784568?source_id1005 target_blankp styledisplay: inline;margin-left: 110px51单片机/p/aa hrefhttps://blog.csdn.net/fantastic_sky/article/details/110229474 target_blankp styledisplay: inline;margin-left: 160pxSTM32单片机/p/aa hrefhttps://zhuanlan.zhihu.com/p/108050248 target_blankp styledisplay: inline;margin-left: 158pxZigBee技术/p/a/div/divdiv iddream stylemargin-left:15%;br / br / br / br / br /h1 styletext-align: center;梦想/h1div stylemargin:0 15% 0 5%;p stylepadding: 20pxemsp;emsp;终极梦想的话是实现财富自由通俗点来说就是能满足日常生活的开销想去旅游或者玩的时候不会太受金钱的限制还有就是如果家人生病需要住院什么的不会太为了医药的费用而去去发愁。br /emsp;emsp;目前在大学阶段的梦想或者说目标是学好本专业的专业知识打好基础争取多去参加一些比赛锻炼自己的能力当然更希望拿一些奖多搞些学术论文希望能争取到学院推免的名额。/p/divbr / br / br / br / br //div/body
/html
3.3 个人爱好
!DOCTYPE html
html langenheadmeta charsetUTF-8title个人爱好/titlestylebody{background-color: #000000;}div.a{float:left;position:relative;left:50%;}div.b {position: relative;left: -50%;}.center {margin: auto;width: 50%;}/style/headbodydiv stylebackground-color: #555555;height: 100%;width:100%;float: lefta hrefjavascript:history.back(-1) styletext-decoration: none;color: redp stylefont-size: 22px;display: inline返回上一页/p/ah1 styletext-align: center;color: white个人爱好/h1div stylefloat: left;margin-left: 55pxp stylecolor: white;font-size: 20px1,跑步/pimg srcpicture/跑步.jpg/divdiv stylefloat: left;margin-left: 55pxp stylecolor: white;font-size: 20px2,骑行/pimg srcpicture/骑行.jpg stylewidth: 420px/divdiv stylefloat: left;margin-left: 55pxp stylecolor: white;font-size: 20px3,羽毛球/pimg srcpicture/羽毛球1.jpg styleheight: 257px;width: 211px/divdiv stylefloat: left;margin-left: 55pxp stylecolor: white;font-size: 20px;4,篮球/pimg srcpicture/篮球.jpg styleheight: 257px;width: 393px;/divdiv stylefloat: left;margin-left: 55pxp stylecolor: white;font-size: 20px;5,音乐/pimg srcpicture/音乐.jpg styleheight: 257px;width: 420px/divdiv stylefloat: left;margin-left: 55pxp stylecolor: white;font-size: 20px;6,乒乓球/pimg srcpicture/乒乓球4.jpg styleheight: 257px;width: 211px/div/div/body
/html
3.4 个人成绩根据自己的情况添加
!DOCTYPE html
html langenheadmeta charsetUTF-8title个人成绩/titlestylebody{background-color: black;}/style/headbodydiv stylebackground-color: #555555a hrefjavascript:history.back(-1) styletext-decoration: none;color: redp stylefont-size: 22px;display: inline返回上一页/p/ah1 styletext-align: center;color: white个人成绩/h1!--内容根据自己的情况设置--
!-- h2 stylecolor: white大一上/h2--img srcpicture/11.jpg stylewidth: 850px;height:500px
!-- h2 stylecolor: white大一下/h2--
!-- img srcpicture/成绩1.png stylewidth: 1250px--
!-- h2 stylecolor: white大二上/h2--
!-- img srcpicture/成绩2.png stylewidth: 1250px;margin-bottom: 40px--/div/body
/html
3.5 收藏夹
!DOCTYPE html
html langenheadmeta charsetUTF-8title收藏夹/titlestylebody{background-image:url(picture/16.jpg);background-size:100% 100%;background-attachment: fixed;/*background-image-z-index: -1;*/background-repeat:no-repeat;}div.a{float:left;position:relative;left:50%;}div.b {position: relative;left: -50%;}p.a{font-size: 18px;color: #6400fc;}img.a{float:left;position:relative;left:50%;}/style/headbodya hrefjavascript:history.back(-1) styletext-decoration: none;color: #ff0000;h2 stylefont-size: 25px;display: inline;margin-left: 250px返回上一页/h2/ah1 styletext-align: center;font-size: 35px收藏夹/h1h2 stylemargin-left: 20px;font-size: 28px短句/h2div stylefloat:left;margin-left: 40px;p classa1从来就不存在什么意外/pp classa4一生清贫怎敢如繁华两袖清风怎敢误佳人/pp classa7人的贪婪就在于你想拥有你不配拥有的东西/p/divdiv stylefloat:left;margin-left: 40px;p classa 2岂能尽如人意所以减少期待/pp classa5少说废话多行动埋头苦干别认怂/pp classa8在这个爱意泛滥的时代深情反而成了错误/p/divdiv stylefloat:left;margin-left: 40px;p classa3没有明天背水一战/pp classa6梦想与现实之间的距离叫行动/pp classa9你要悄悄拔尖然后惊艳所有人/p/divh2 stylemargin-top: 250px;margin-left :20px;clear: both;font-size: 28px图片/h2img srcpicture/39.jpg stylewidth: 400px;height: 300pximg srcpicture/35.jpg stylewidth: 400px;height: 300pximg srcpicture/38.jpg stylewidth: 400px;height: 300pximg srcpicture/51.jpg stylewidth: 400px;height: 300pximg srcpicture/49.jpg stylewidth: 400px;height: 300pximg srcpicture/48.jpg stylewidth: 400px;height: 300pximg srcpicture/28.jpg stylewidth: 400px;height: 300pximg srcpicture/50.jpg stylewidth: 400px;height: 300pximg srcpicture/26.jpg stylewidth: 400px;height: 300pximg srcpicture/34.jpg stylewidth: 400px;height: 300pximg srcpicture/41.jpg stylewidth: 400px;height: 300pximg srcpicture/37.jpg stylewidth: 400px;height: 300pximg srcpicture/44.jpg stylewidth: 400px;height: 300pximg srcpicture/40.jpg stylewidth: 400px;height: 300pximg srcpicture/43.jpg stylewidth: 400px;height: 300pximg srcpicture/47.jpg stylewidth: 400px;height: 300pximg srcpicture/46.jpg stylewidth: 400px;height: 300pximg srcpicture/27.jpg stylewidth: 400px;height: 300pximg srcpicture/33.jpg stylewidth: 400px;height: 300pximg srcpicture/32.jpg stylewidth: 400px;height: 300pximg srcpicture/29.jpg stylewidth: 400px;height: 300pximg srcpicture/36.jpg stylewidth: 300px;height: 400pximg srcpicture/45.jpg stylewidth: 300px;height: 400pximg srcpicture/42.jpg stylewidth: 300px;height: 400px/body
/html
4 可能要用的图片其他根据自己情况选或者全部自己找新的
4.1 主页 4.2 个人简介 4.3 收藏夹