DESKTOP-ALQOPKI_实习日志 2021年05月21日张金虎

学员日志 498 3年前 0 云创动力

实习日志

一、知识总结

1.解剖HTML文档

<!DOCTYPE html>：声明文档类型

元素：这个元素包裹了整个完整的网页，是一个根元素。

:这个元素设置文档使用utf-8字符集编码。

：元素是一个容器。

设置页面标题。

2.元数据（元素）

元数据是描述数据的数据，而HTML有一个“官方的”方式来为一个文档添加元数据——< mete >元素。

3.乱码

编码

解码

出现乱码的原因：编码与解码不一致，导致出现乱码。

4.列表

可以将每一项都进行编码。

可以通过type属性更改编号类型。

Type：circle：空心圆

disc: 实心圆

square：方形

5.表格

合并单元格：

合并列：col span

合并行：row span

：标签表示表格中的一行。

：标签表示表格中的一列。

Border：表格的边框、数值、默认为元素。

Cell padding：内容与单元格边框之间的距离。

Cell spacing：单元格之间的空隙。

6.表单（form：数据提交的载体）

:用于为用户创建HTML。

Action：数据提交的地址。

Method：数据提交的方式。

Enc type：编码方式，默认为application/x-WWW-form-urlencoded。

7.表单元素

：根据type属性值的不同表示多种输入方式。

：表示多行文本框</p> <p><select>：表示向下按钮</p> <p><button>：表示按钮</p> <p>Name：元素名，常用的标签都有此属性。</p> <p>Id：元素唯一表示，常用的标签都有此属性。</p> <p>Title：鼠标悬停后显示的内容。</p> <p>Auto focus：自动获取焦点。</p> <p>Placeholder：提示。</p> <p>Required：必填。</p> <p>Read only：只读</p> <p>Disabled：禁用。</p> <p>Max length：限制长度。</p> <p>Text：文本输入框</p> <p>Button/submit/reset：按钮</p> <p>Password：密码输入框</p> <h2 id="toc_9">8.超链接</h2> <p>必须有href属性。</p> <p>Href点击链接跳转后的地址</p> <h2 id="toc_10">9.多媒体</h2> <p>Scr：图像源</p> <p>Src：用于定义视频源，如果显示此音频需要加contrds属性。</p> <p>Alt：图片不能被正常显示时，显示此属性。</p> <p>Width：图片的宽度</p> <p>Height：图片的高度</p> <p>一般width和height不同时设置，因此单独设置width或height属性。</p> <p>Controls：控制面板</p> <p>Autoplay：自动播放</p> <p>Muted：静音</p> <p>Loop：循环播放</p> <h1 id="toc_11">二、心得体会</h1> <p>通过老师的讲解与演示，发现自己在编程方面存在着诸多的问题，语言运用不规范，缺乏设计理念。</p> <div class="wbp-cbm"> <div class="wb-btn-like" data-post_id="9527" data-count="0" ><svg class="wb-icon wbsico-like"><use xlink:href="#wbsico-like"></use></svg> <span class="like-count">点赞</span> </div> </div> </div> </article> <div class="sidebar"> <div class="sb-inner"> <div class="width-border-box"> <section class="widget widget-download"> <div class="wbdl-custom-info"></div> </section> <section class="widget widget-social"> <div class="wb-inline-mode"><a class="wb-share-poster j-poster-btn" data-id="9527"><svg class="wb-icon wbsico-poster"><use xlink:href="#wbsico-poster"></use></svg><span>微海报</span></a><div class="wb-share-list" > <a class="share-logo icon-weixin" data-cmd="weixin" title="分享到微信" rel="nofollow"> <svg class="wb-icon wbsico-share-weixin"><use xlink:href="#wbsico-share-weixin"></use></svg> </a> <a class="share-logo icon-qq" data-cmd="qq" title="分享到QQ" rel="nofollow"> <svg class="wb-icon wbsico-share-qq"><use xlink:href="#wbsico-share-qq"></use></svg> </a> <a class="share-logo icon-weibo" data-cmd="weibo" title="分享到微博" rel="nofollow"> <svg class="wb-icon wbsico-share-weibo"><use xlink:href="#wbsico-share-weibo"></use></svg> </a> </div></div> <span class="fav" data-id="9527"> <svg class="wb-icon wbsico-fav"><use xlink:href="#wbsico-fav"></use></svg> </span> </section> </div> <section class="widget widget-hot"> <h3>热门资源</h3><ul class="post-list wb-scroll-list"><li class="post" data-num="1"> <div class="inner"> <a class="media-pic" href="https://www.ycdledu.com/si-zhong-kuang-jia-de-qu-bie-bi-jiao/6634/"><img class="auto-cover" src="https://gitee.com/FengJiali52155/fjlimg/raw/master/20201205202145.png" loading="lazy" decoding="async" alt="四种框架的区别比较：bootstrap,layui,elementui,vantui"></a> <div class="media-body"> <a class="title" href="https://www.ycdledu.com/si-zhong-kuang-jia-de-qu-bie-bi-jiao/6634/" data-num="1">四种框架的区别比较：bootstrap,layui,elementui,vantui</a> <p class="post-metas"><svg class="wb-icon wbsico-views"><use xlink:href="#wbsico-views"></use></svg><em class="meta-dl">3680</em></p> </div> </li><li class="post" data-num="2"> <div class="inner"> <a class="media-pic" href="https://www.ycdledu.com/liangheji20201026/5411/"><img src="data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" alt="梁贺寄-20201026"></a> <div class="media-body"> <a class="title" href="https://www.ycdledu.com/liangheji20201026/5411/" data-num="2">梁贺寄-20201026</a> <p class="post-metas"><svg class="wb-icon wbsico-views"><use xlink:href="#wbsico-views"></use></svg><em class="meta-dl">3589</em></p> </div> </li><li class="post" data-num="3"> <div class="inner"> <a class="media-pic" href="https://www.ycdledu.com/chenbaian20201026/5393/"><img src="data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" alt="陈柏安-20201026"></a> <div class="media-body"> <a class="title" href="https://www.ycdledu.com/chenbaian20201026/5393/" data-num="3">陈柏安-20201026</a> <p class="post-metas"><svg class="wb-icon wbsico-views"><use xlink:href="#wbsico-views"></use></svg><em class="meta-dl">3164</em></p> </div> </li><li class="post" data-num="4"> <div class="inner"> <a class="media-pic" href="https://www.ycdledu.com/20201105%e6%a2%81%e8%b4%ba%e5%af%84/6237/"><img src="data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" alt="2020-11-05梁贺寄"></a> <div class="media-body"> <a class="title" href="https://www.ycdledu.com/20201105%e6%a2%81%e8%b4%ba%e5%af%84/6237/" data-num="4">2020-11-05梁贺寄</a> <p class="post-metas"><svg class="wb-icon wbsico-views"><use xlink:href="#wbsico-views"></use></svg><em class="meta-dl">1585</em></p> </div> </li><li class="post" data-num="5"> <div class="inner"> <a class="media-pic" href="https://www.ycdledu.com/mac-an-zhuangnpm-install-g-vuecli-bao-cuo-jie-jue/2919/"><img class="auto-cover" src="http://www.ycdledu.com/wp-content/uploads/2020/09/16002385361401.jpg" loading="lazy" decoding="async" alt="mac安装npm install -g @vue/cli报错解决"></a> <div class="media-body"> <a class="title" href="https://www.ycdledu.com/mac-an-zhuangnpm-install-g-vuecli-bao-cuo-jie-jue/2919/" data-num="5">mac安装npm install -g @vue/cli报错解决</a> <p class="post-metas"><svg class="wb-icon wbsico-views"><use xlink:href="#wbsico-views"></use></svg><em class="meta-dl">1464</em></p> </div> </li></ul></section> </div> </div></div> <section class="panel-inner panel-tags pw"> <div class="tag-items hot-tags"> <a href="https://www.ycdledu.com/tag/it%e7%89%b9%e7%a7%8d%e5%85%b5/">IT特种兵</a> <a href="https://www.ycdledu.com/tag/java%e5%85%a8%e6%a0%88%e5%b7%a5%e7%a8%8b%e5%b8%88/">Java全栈工程师</a> <a href="https://www.ycdledu.com/tag/%e4%ba%91%e5%88%9b%e5%8a%a8%e5%8a%9b/">云创动力</a> <a href="https://www.ycdledu.com/tag/%e4%ba%91%e5%88%9b%e9%9b%86%e8%ae%ad/">云创集训</a> <a href="https://www.ycdledu.com/tag/%e5%89%8d%e7%ab%af%e5%bc%80%e5%8f%91%e5%b7%a5%e7%a8%8b%e5%b8%88/">前端开发工程师</a> <a href="https://www.ycdledu.com/tag/%e5%ad%a6%e5%91%98%e6%97%a5%e5%bf%97/">学员日志</a> <a href="https://www.ycdledu.com/tag/%e5%bc%80%e5%8f%91%e5%96%b5%e5%ad%a6%e9%99%a2/">开发喵学院</a> <a href="https://www.ycdledu.com/tag/%e6%88%90%e9%83%bd%e7%89%a9%e8%81%94%e7%bd%91/">成都物联网</a> <a href="https://www.ycdledu.com/tag/%e6%95%99%e8%82%b2%e7%94%9f%e6%80%81%e6%9c%8d%e5%8a%a1%e5%95%86/">教育生态服务商</a> </div> </section> <section class="pw related-posts panel-inner"> <h3 class="sc-title">相关推荐</h3> <ul class="articles-list list-mode-a"><li class="post"> <a class="inner" href="https://www.ycdledu.com/desktopsjoma8q20200828da-xu-hui/8080/"> <div class="media-pic"><img src="data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" alt="DESKTOP-SJOMA8Q_20200828-达旭辉"></div> <div class="media-body"> <div class="post-title">DESKTOP-SJOMA8Q_20200828-达旭辉</div> </div> </a> </li><li class="post"> <a class="inner" href="https://www.ycdledu.com/20201214yuan-xin/6562/"> <div class="media-pic"><img src="data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" alt="20201214+袁鑫"></div> <div class="media-body"> <div class="post-title">20201214+袁鑫</div> </div> </a> </li><li class="post"> <a class="inner" href="https://www.ycdledu.com/20201117-2/6115/"> <div class="media-pic"><img class="auto-cover" src="C:UserswkDesktop%E6%96%B0%E5%BB%BA%E6%96%87%E4%BB%B6%E5%A4%B911.17.jpg" loading="lazy" decoding="async" alt="2020.11.17" sizes="(max-width: 1200px) 300px, (max-width: 1400px) 250px, 300px"></div> <div class="media-body"> <div class="post-title">2020.11.17</div> </div> </a> </li><li class="post"> <a class="inner" href="https://www.ycdledu.com/erhaimoonxue-xi-ri-zhi-day13/6147/"> <div class="media-pic"><img class="auto-cover" src="https://i.loli.net/2020/12/09/UVqx6ofOLITutBR.png" loading="lazy" decoding="async" alt="ERHAIMOON_学习日志(day13)" sizes="(max-width: 1200px) 300px, (max-width: 1400px) 250px, 300px"></div> <div class="media-body"> <div class="post-title">ERHAIMOON_学习日志(day13)</div> </div> </a> </li></ul> </section> </div> <footer class="footer"> <div class="ft-inner pw"> <div class="copyright"> <div class="ib"> © 2024 成都云创动力科技有限公司 </div> <a class="ib pdh" href="https://beian.miit.gov.cn/" rel="nofollow" target="_blank">蜀ICP备20006351号-1</a> </div> </div> </footer> <script type="text/javascript" src="https://www.ycdledu.com/wp-content/plugins/metronet-profile-picture/js/mpp-frontend.js?ver=2.3.11" id="mpp_gutenberg_tabs-js"></script> <script type="text/javascript" src="https://www.ycdledu.com/wp-content/themes/storeys-pro/js/base.js?ver=2.5.3" id="wbolt-base-js"></script> <script type="text/javascript" src="https://www.ycdledu.com/wp-content/themes/storeys-pro/js/single.js?ver=2.5.3" id="wbolt-single-js"></script> <div class="tool-bar" id="J_toolBar"> <a class="tb-item dm-switch" id="J_DMswitch" href="javascript:;" rel="nofollow"> <span class="item-btn" title="模式切换"> <svg class="wb-icon wbsico-dm-switch"><use xlink:href="#wbsico-dm-switch"></use></svg> </span> </a> <div class="tb-item social-item"><a class="item-btn" title="联系工单"href="https://www.ycdledu.com/wp-login.php?redirect_to=https%3A%2F%2Fwww.ycdledu.com%2F%3Fwb%3Dmember%23%2Fcontact" ><svg class="wb-icon tools-contact"><use xlink:href="#tools-contact"></use></svg></a></div> <a class="tb-item " id="J_backTop" href="javascript:;" rel="nofollow"> <span class="item-btn" title="返回页顶"><svg class="wb-icon wbsico-backtop"><use xlink:href="#wbsico-backtop"></use></svg></span> </a> </div> </body> </html>