divcss制作一个网页布局

 时间:2024-10-12 10:58:14

1、启动一个写html代码的编辑器,比如vscode、webstrom、Hbuilder等ide。如图示例用vs。

divcss制作一个网页布局

2、在左侧空白处 右键鼠标在弹出的菜单中选择 新建文件。

divcss制作一个网页布局

3、输入文件名称及后缀。如图示例:demo.html文件。

divcss制作一个网页布局

4、输入doc再按下Tab快捷键。由软件自动补全部分默认代码。如图。

divcss制作一个网页布局

5、接下来在head标签中,添加style标签,在其里面书写我们的样式代码。在其body标签中,书写我们的布局代码div等。

divcss制作一个网页布局

6、代码写完后按ctrl+s保存文件。在 我的电脑 中找到刚才的文件路径。双击鼠标使用默认的浏览器打开。

divcss制作一个网页布局

7、最后我们刚才输入的代码显示结果如下,成功实现简单的页面布局。如需更复杂的布局。继续添加其他结构及样式。包括js代码等。

divcss制作一个网页布局
  • 网页设计制作详细流程
  • html利用hr标签设置一条水平线分割线
  • div+css 如何实现左右分栏
  • html如何创建一个没有边框的表格
  • 通过CSS+DIV怎么将文字写在图片上方
  • 热门搜索
    廉洁在我心中手抄报 食品药品安全手抄报 感恩亲情手抄报 四季手抄报 英语手抄报版面设计图 数学园地手抄报 小学生讲文明手抄报 小学垃圾分类手抄报 家乡手抄报 手抄报简单