睡不醒的阿豪-CSDN博客

原创网页结构之模仿导航栏

这几天也几个人关注了我，我开心到起飞。哈哈哈哈，那今天我们就更新一下如何标准的写一个网页结构。我们先分析导航栏的布局这里的布局是大盒子然后分成三部分，然后两边固定，中间居中且·搜索框大小不变。两边做然后我们先来个大盒子里面三个盒子然后大盒子设置flex布局宽度百分百高度48px 获取浏览器像素还有白色背景，记得先给boby来个浅灰色背景然后效果如下Css:如下图*号这个部分是每次写网站必须写的，代表a标签没有下划线，li标签没有前面的...

2021-08-31 22:28:56 523 1

原创小白看了都说好系列，grid布局

今天我们来学习grid布局，它是一个网格布局，与flex布局配合使用，完成一个比较完美操作简单的布局，grid布局中是把容器划分成行和列，产生的单元格，然后项目就在单元格里面，上一章我们说过容器和项目就是大盒子与大盒子里面的小盒子，然后我们现在直接开始今天的学习。Grid布局与flex布局一样有行和列，但是里面又有间距和区域，所以总的功能比flex布局强大，而且代码实现也比flex布局简洁，看下图（记住了grid布局简简单单）容器属性列表示属性：Grid-templa

2021-08-19 21:26:06 292

原创小白看了都说好的flex布局讲解

虽然吧，博客没多少人看，但是坚持更新也是对自己学习的监督，加油打工人。今天我们来说说flex布局，flex布局呢现在比较流行，而且实用性强，在教学之前我也是做了一点功课，查看了别的up主的一些教程，感觉讲都很可以，现在我也来讲讲，组成：容器和项目啥是容器啥是项目，下面图片主轴和交叉轴围成一个大盒子就是容器项目就是大盒子里面的小盒子，项目在容器中显示，主要是由两个轴确定的，在容器中默认有水平的主轴和垂直的交叉轴，项目在容器中默认沿主轴（水平）排列介绍完概念.

2021-08-17 22:32:51 701

原创 float布局讲解

今天干活腰酸，年纪轻轻就这样了，不知道要是以后干程序猿会不会更疼，还吃坏肚子，难受的一天，不过我还是拼命为友友们更新。好了废话不多说，今天我们一起来学习float布局，希望大家多支持，多点赞，我们先弄三个盒子，正常是下面这样的然后再三个盒子里面使用float布局这时候设置的左边盒子最左边显示和右边盒子最右边显示，但是中间的盒子缺不见了。这是因为中间的盒子没有脱离文档流，默认显示在大盒子的最左边，这时候我们给中间的盒子加宽度以及内容大盒子明显没有80

2021-08-13 21:30:20 606

原创 html基本布局（理解，代码实现教程后续更新）

写前端网站最主要的是布局用得好，现在我先带友友们认识布局，实现教程后续更新前端布局主要有Float（浮动布局）：因为该布局缺点大，被认为是辅助布局，新手试用。元素的水平方向浮动，意味着元素只能左右移动而不能上下移动。直到它的外边缘碰到包含框或另一个浮动框的边框为止。这是所有盒子向左浮动一个挨着一个，如果所有盒子占满浏览器的窗口就会重新换行显示，所有我们窗口大小会影响网站布局，这个就是其中的缺点。所以很少使用flex（弹性布局）：现在flex布局是网页的主流布局，大多面

2021-08-11 22:43:39 148

原创 html+css实现博客网页设计（毕业设计）

代码有些细节没有处理好，但是用于毕业设计可以。设置收费是为了防止代码过于泄露，希望大家能一起学习html，希望我们的代码之路更好原创：阿豪链接：https://pan.baidu.com/s/1swodmMOSJmriuwXevIoHrw提取码：k6cq...

2021-08-06 11:38:29 2026 1

原创 html +css实现京东首页（暂时未完全实现）

老师叫我们写的一些模仿代码，让大家一起更好的学习html，代码链接：https://pan.baidu.com/s/1AspQLIxC7FlR3kFhnCwUow提取码：dpya

2021-08-06 11:23:46 269

原创 html中常用标签（表）

表格是用来展示大量的数据<table><tr> <td>姓名</td><td>姓别</td> <td>年龄</td></tr><tr> <td>张三</td><td>男</td> <td>18</td></tr></table>Table是大盒子tr是盒子里面的行 td是表格

2021-08-06 11:15:19 118

原创 html中常用标签

< div ></div>和<span></span>都是盒子用来装东西的区别：div是division的缩写，表示分割，分区。Span意为跨度，跨距Div用来布局，独占一行，可以理解为大盒子，是块元素；<span>在行内定义一个区域，也就是一行内可以被<span>划分成好几个区域，从而实现某种特定效果。可以理解为小盒子，而span是行内元素(也译作内嵌元素)。<img src=“./img.png’”&g

2021-08-06 11:14:30 100

原创 html结构介绍及html文档标签

Vs code中输入 “!”会自动显示网页的结构，省事<!DOCTYPE html>告诉浏览器这个页面采取html5来显示<html lang = “en”>这个是英文网站，中文为zh-CN<mate charset=”UTF-8”/> UTF-8是万国码h1到h6是标题标签，加了该标签文字变粗，字号也会依次变大，而每个标题占一行p标签可以把html中的文档分割为若干段落，根据浏览器的窗口自动换行,强制换行<br />加粗<str

2021-08-06 11:13:10 57

阿豪的博客