今天给大家分享的是使用HTML模仿一个简单页面模仿图如下:
今天才学了一点的HTML基础,使用的也是一些比较基础的知识,如有错误之处,还请大家批评指正。接下来就开始我今天的分享
分析图片我将界面分成了6个div。
第一个div,用于最上面的导航栏,并且使用无序列表,设置id属性值,方便后续引入外部样式。
让所有的 li向左浮动,为了不让标签互相挨得太近,就使用span标签放入空格符将其隔开一点,
因为无序列表前面会有一个符号,所以我们这里将其去掉。
第二个div:
我直接放的是我图片,并且设置宽度和高度
将盒子的宽度和高度按我们的内容进行设置,并且将其居中
第三个div:
就使用的是我们的输入框和百度一下按钮
这里没有对其进行一些属性的设置(别问,问就是忘记了)
第四个div;
则放的是我的百度热搜榜,使用有序列表ol,并且设置title
样式设置的和我们上面的样式设置的是一样的
第五个和第六个div则是放在我们的foot部分:
这里同样是和我们的上面的导航栏一样的样式,这里的span是被iden隐藏起来的空格符(其实就是想说我写对了,不是直接敲得空格)
样式也是和我们之前一样的
这里我使用了:标签选择器,使用了id选择器,也是用了外部样式表以及我们的行内样式
今天分享就结束了,多谢各位,如有优化的地方以及错误的地方,还请各位多多指正。我一定会认真吸取教训,认真修改的!