马马虎虎学了一个周的html+css,开始了自己人生中的第一个网页编写，记录一下

感受

跟着绿叶学习网上计划完成了html和css的学习，然后就是完成第一个”大作业“
整个编写过程中个人觉得最难的是元素的布局，也就是把元素放到自己想要的位置去，然而这也是html要完成的核心任务，在知乎上提了个问，大多数回答还是要多练，但也有人说不要一开始就做项目，要夯实基础。我个人觉得其实做一个静态网页是对小白提升最快的途径。遇到问题时，要么百度，但是不知道是不是html太简单的原因，感觉百度大多是关于css样式的问题，很多在布局上的问题都解决不了，只能对着百度首页检查元素，自己一个一个慢慢试，哎~花了两个晚上总体加起来大约7小时，就完成了一个百度首页，原本完成第一个网页的激动感直接没有了。。然而打开csdn首页第一个视频就是一位大佬花一天时间完成了京东官网的编写。。。。这次第，怎一愁字了得。
今天看了一些js的内容，因为专业有学过c++课程，所以现在基础部分能懂，不过之后的很多东西就得重头开始学习了。
这个周的学习感觉很潦草，周末还有MATLAB期末考试，复习复习复习！
前路漫长~加油！

<!DOCTYPE html>
<html>
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>百度一下，你就知道</title><style type="text/css">div{display: block;}.wraaper_new{position: relative;height: 100%;width: 100%;min-height: 768px;cursor: default;}.head{position:absolute;width:100%;min-width: 1000px;}.head1{margin-top: 25px;}.head2_l{ color: black;float:left;line-height:22px;font-size: 15.5px;text-align:center;padding:0 27px;margin-left:-6px;}.head2_r{line-height:22px;color: black;float:right;text-align:center;margin-right: 30px;  font-size: 15.5x; padding-left:20px;}a{text-decoration:none;} .search{position:relative;width:100%;min-width: 1000px;margin:0 auto;text-align: center;}.ico{position: absolute;text-align: center;width: 100%;padding-top: 22px ;}img{width: 350px;height: 160px;}.textbox{position:relative;text-align: center;margin-top: 15px ;border-radius:20px 0 0 20px;width: 750px;height: 50px;border-color:rgb(25, 162, 216);text-align: left;font-size: 20px;outline: medium;/*解决点击文本框出现外框的问题*/}.search_btn{position: relative;left:1200px;top: -58.5px;float: left;}  .clear{clear:both;}</style>
</head>
<body><div id="wrapper" class="wrapper_new"><div class=“head“><div class="head1"><a href="http://news.baidu.com/" target="_blank";><div class="head2_l">新闻</div></a><a href="https://www.hao123.com/"target="_blank";><div class="head2_l">hao123</div></a><a href="http://map.baidu.com/"target="_blank";><div class="head2_l">地图</div></a><a href="https://live.baidu.com/"target="_blank";><div class="head2_l">直播</div></a><a href="https://haokan.baidu.com/?sfrom=baidu-top"target="_blank";><div class="head2_l">视频</div></a><a href="http://tieba.baidu.com/"target="_blank"><div class="head2_l";>贴吧</div></a><a href="http://xueshu.baidu.com/"target="_blank"><div class="head2_l";>学术</div> </a> <a href="http://www.baidu.com/more/"target="_blank"><div class="head2_l";>更多</div></a><a href="https://www.baidu.com/my/" target="_blank";><div class="head2_r">用户</div></a><a href="https://www.baidu.com/s?tn=baidutop10&rsv_idx=2&wd=%E9%9D%92%E5%B2%9B%E5%A4%A9%E6%B0%94%E9%A2%84%E6%8A%A5" target="_blank"; ><div class="head2_r">15°C</div></a><div class="head2_r">设置</div></a><a href="http://news.baidu.com/" target="_blank";><div class="head2_r">优</div></a><a href="https://www.baidu.com/s?tn=baidutop10&rsv_idx=2&wd=%E9%9D%92%E5%B2%9B%E5%A4%A9%E6%B0%94%E9%A2%84%E6%8A%A5" target="_blank";><div class="head2_r">青岛</div></a><div class="clear"></div>    </div></div><div class="search"><div class="ico"><a href="https://www.baidu.com/s?wd=%E4%BB%8A%E6%97%A5%E6%96%B0%E9%B2%9C%E4%BA%8B&tn=SE_Pclogo_6ysd4c7a&sa=ire_dl_gh_logo&rsv_dl=igh_logo_pc" target="_blank"><img src="https://www.baidu.com/img/bd_logo1.png?where=super"  width=270 height=130 alt="" title="百度一下，你就知道"></a>  <div class="serach_wrapper"><div calss="textbox"><input type="text" class="textbox" maxlength="100" autocomplete="off"></div><div class="search_btn" ><input type="button" value="百度一下" style="
                cursor:pointer;
                height:56px;
                width:110px;
                color:#fff;
                background:#4e6ef2;
                border-radius:0 20px 20px 0;
                outline:none;
                font-size:17px;
                border:none;
                position: relative;
                left: -6px;
                top: 2px;
                cursor:pointer;" ></div></div></div></div>
</body>
</html>

记录第一次写静态网页-百度首页相关推荐

Appium+python+夜神模拟器微信公众号记录第一次写用例所踩的坑
这里写自定义目录标题登录微信进入微信公众号登录微信 caps = {} caps["platformName"] = "Android" caps[&qu ...
手机端静态网页制作需要注意的几个问题
在手机端(移动端)进行静态网页的制作,主要考虑不同手机兼容性的问题,需要达到在不同类型的手机上,网页都能有一个良好的展示效果.为了达到这个效果,我们在写静态网页时需要注意几个问题. 1 viewpor ...
html5页面结构案例,前端学习笔记（五）HTML+CSS静态页面实战案例：幸福西饼首页和百度首页...
按照知乎上面汪小黑推荐的前端学习路径,在自学了HTML和CSS之后,开始尝试实战制作静态页面小项目. 幸福西饼首页制作首先我在网上下载到了千锋教育提供的的幸福西饼官网静态页面的教学视频和图片素材.源 ...
仿写百度首页的float布局
介绍之前已经写过很多遍百度首页了,但是今天的记录的重点是不同以往,才用的布局方式是float,浮动的方式来布局. 查看百度首页的源码是采用绝对定位的方式进行布局的今天来记录另一种布局方式,只不过是 ...
用HTML编写携程旅行,StaticHtmlPage(仿照携程写的静态网页)
StaticHtmlPage(仿照携程写的静态网页) 文章目录 StaticHtmlPage(仿照携程写的静态网页) 一,项目简介二,项目运行部署三,项目结构四,效果展示五,技术囊括 HTML ...
Latex第一次写论文记录
Latex第一次写论文记录 1. Latex的安装 2. Latex的简单使用 4. Latex模板 5. 论文标题,作者 6. Abstract 7. Introduction 7.1 文献的引用 ...
第一次写博客，在正式记录之前，先来一个背景简介和分享
第一次写博客.在正式记录之前,先来一个背景简介和分享. 文章目录毕业一.汽车厂是怎么样的工厂? 二.汽车厂的技术路线步伐 1.总装车间维修电工 2.学习PLC编程 3.打开PC应用程序exe的大门 ...
前端：用html写百度首页
0 准备工作初学html,要求用html写一个百度首页老师推荐了html的学习网站(菜鸟教程里html的教程也很棒): https://www.w3school.com.cn/html/index ...
用HTML+CSS编写一个计科院网站首页的静态网页
用HTML+CSS编写一个计科院网站首页的静态网页利用浏览器查看网页源代码,并将一些图片分门别类的下载到本地,然后删除javascript脚本. 项目的文件目录最终效果 <!DOCTYPE ...

记录第一次写静态网页-百度首页

感受

记录第一次写静态网页-百度首页相关推荐

最新文章

热门文章