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怎么将文字写在图片上方
  • 热门搜索
    致敬抗美援朝争做时代新人手抄报 教师手抄报 科学知识手抄报 手抄报 国庆节 圣诞节手抄报内容 感谢老师的手抄报 营养与健康手抄报 关于家乡的手抄报 英语手抄报内容5年级 母亲节手抄报图片