学习前,首先准备工具:

1、常用工具下载:google浏览器,调试页面用,360压缩软件,我觉得比较好用。

2、要有html的编辑工具,txt,sumline text ,nodpad++,idea,hbuilder等,推荐下载Hbuilder( 下载地址:HBuilderX-高效极客技巧) ,哦 或者更轻量级的 sublime txt3 ,同样有语法提示。

Sublime Text - Text Editing, Done Right

下载-解压 -打开-Hbuilder.exe。

可以右键发送快捷方式到桌面

双击打开,即可,可以新建目录或者文件。我下面已windows自带的txt演示。

新建txt,右键重名为 1.html

手写<input value='兄弟加油' type='text'> ,保存,双击打开看效果。

这个txt会打开乱码问题,先用nodepad++吧。

传送门 :链接: https://pan.baidu.com/s/138gF8aF0YSKZUK8mfsAZrg 提取码: khpj 复制这段内容后打开百度网盘手机App,操作更方便哦

或sublime txt 3  地址Sublime Text - Text Editing, Done Right

安装64位版本的,看电脑版本安装。

input 表单标签是html语言的最基础的标签之一,

还有 <select>标签,<div>盒子 标签,就是页面上的方块,<table>,列表标签。

详细看 www3c 或菜鸟教程 HTML 教程 | 菜鸟教程

每一标签 都要试一试。

<input value='兄弟加油' type='text'>

<input value='兄弟加油' type='button'>

<input  type='number'>

<input  type='date'>

<select>
    <option value='A'>男<option>
    <option value='A'>女<option>
<select>

<img src='1.png' style='width=400px;height:400px;'>

<div style='width:400px;height:400px;;background-color:green' ></div>

2、静态网页(html)的服务器,nginx或者appche。额,这会是发布的时候才有用,自己开发的话,跳过这一步,直接写静态页面就可以,一个浏览器就可以了。htmL文件双击用浏览器打开。

ngixn下载地址:nginx: download

appache下载地址 :Download - The Apache HTTP Server Project

参考(Apache下载、安装及配置(Windows版))

现在以nginx为例介绍网页的编写。

下载比较慢,传送门:链接: https://pan.baidu.com/s/1DpvkThWRaHbp1qJ92hVrbg 提取码: qykm 复制这段内容后打开百度网盘手机App,操作更方便哦

第二步 运行nginx,访问默认文件。双击nginx.exe启动

双击 nginx.exe看下效果

这就是成功了,看些默认html的内容,是否跟他一样。

一样的。

把刚才的1.html 复制到index路径下

重名为 index.html,之前的index随便命名个名字 比如index0.保存后刷新刚才的访问地址:

http://localhost:80http://localhost:80

图片不显示,路径不对,吧图片粘贴到同一路径下,

用   法外狂徒.jpeg 改为 1.png

行了。

这里 nginx 修改了修改了文件应该是需要重新加载 或者重启下

cmd进入到 nginx的安装目录

这里

或者shift + 右键鼠标 调出 cmd poweshell

使用  nginx.exe -s reload  命令,回车就可以。

start nginx.exe       ## 启动服务
nginx.exe -s stop      ## 快速停止服务
nginx.exe -s quit      ## 优雅的 停止服务

nginx.exe -s reload      ## 重新加载 配置文件,这命令可以不用停止nginx
nginx.exe -s reopen      ## 重新打开日志文件

到此说下概念:

html标签语言是前端展示页面的一种可以被浏览器 识别解析渲染的语言,此外还有css样式语言,给html页面调整样式的,比如长宽高,距离左右,背景颜色,背景图片,布局的位置,在网页上的位置。还有js语言,全称javascript,一种可以上页面动起来的语言,比如监控动作,点击,数量上移的监视动作,轮播图等等等。一般一个绚丽网站的展示都是html + css + js 。关于这三种语言的版本,css是3.0,js已经出到了es6了,对类,继承,高阶函数的支持,有点向jAVA,php等高级语言的语法学习了。

再深入入门的话,可以去菜鸟   CSS 简介 | 菜鸟教程

或者 w3school HTML 教程  学习每个html标签的用法和css的用法,很简单,我当时学了几天就能做京东那样的页面了,虽然有有不协调的地方,入门很快。html标签就是小朋友摆积木,然后css给积木涂颜色变形,js让积木动起来。

初学者写网站(零基础)相关推荐

  1. UI设计学习流程写给零基础学习的你

    UI设计是互联网时代的设计变革,有界面与人之间交互的时候就存在,但却没有现在这样对UI设计专业能力的重视.很多人现在学习UI设计,有的是看重UI设计月能薪破万的高薪资,有的人看重它未来大好的职业发展前 ...

  2. 纯干货!短视频脚本怎么写?零基础新手小白也能写好短视频脚本!【覃小龙课堂】

    hi,我是你的老朋友兼顾问:覃小龙,您可以叫我覃总.今天给您分享我做影视剪辑的一些经验方法,零粉丝也能做,主题名为: 纯干货!短视频脚本怎么写,零基础也能写好短视频脚本 在写脚本以前,我们首先要弄清楚 ...

  3. ctf up怎么写 write_??零基础写网络爬虫的思路??

    网络爬虫,用一句话简单总结,就是一种按照一定的规则,自动的抓取万维网信息的程序或者脚本.写这篇文章的初衷是有个知友私信我说,模仿了很多网上用Python写爬虫的例子,但到了需要自己动手写爬虫的时候又不 ...

  4. 第一个HTML页面如何写?—零基础自学网页制作

    把txt文件变成html网页文件 请按照其中说明创建一个txt文件.具体过程如下: step1:在您方便的磁盘中建立一个文件夹,命名为"零基础自学网页制作".例如我在D盘中建立了& ...

  5. 写给零基础的前端算法入门指南,acmer带女友刷80+【栈与队列与链表篇】

    前言 之前的文章大部分都是写给女友系列,但有一段时间没有进行更新了,一方面春招要准备开始了,另一方面女友还在准备年前面试,面试之后的复盘总结是挺重要的. 访问 HearLing的个人主页 会持续分享前 ...

  6. 写给零基础的前端算法入门指南,acmer带女友刷80+【递归与回溯篇】|牛气冲天新年征文

    前言 各位小伙伴们新年好呀,时隔一周,俺又回来更新文章啦!在上一篇发出去之后,虽然没有得到很多的阅读量,但是后面几篇文章还是得要更新出来,我想总能够帮助一小部分人咯~ 现在和大家分享一下我们是如何准备 ...

  7. 【初学者入门】零基础入门NLP - 新闻文本分类

    序言 从今天开始入门学习NLP,虽然有点晚,但是我觉得任何时候都值得开始,尤其是面对你去感兴趣的事情.今天的任务是 [零基础入门NLP - 新闻文本分类],这是天池大赛中的入门级算法比赛,入口链接请自 ...

  8. 【蓝桥杯】写给零基础入坑蓝桥杯的同学(历届真题解析)

    文章目录 初识:本期专栏想干个啥? 科普:官方介绍就是通过比赛平台提高自我能力的同时提供人才岗位机遇咯 白话分析:参加这个到底有啥好的? 含金量: 技能提升: 机遇: 福利退费: 文末福利 蓝桥杯历届 ...

  9. 写给零基础小白看的入门级 Java 基本语法,强烈推荐

    之前写的一篇我去阅读量非常不错,但有一句留言深深地刺痛了我: 培训班学习半年,工作半年,我现在都看不懂你这篇文章,甚至看不下去,对于我来说有点深. 从表面上看,这句话有点讽刺我的文章写得不够通俗易懂的 ...

最新文章

  1. ArcGIS Engine开发-TOCControl中实现图层的拖放
  2. 为什么携程要做好持续交付?
  3. Linux的僵尸进程及其解决方法(转)
  4. 多分类神经网络与原子核
  5. MyBatis-02 MyBatis XML方式概述及配置步骤
  6. SqlServer2014怎样还原数据库
  7. ios 上传图片失败 小程序_微信小程序ios端 使用ajaxSubmit上传图片失败,android没问题...
  8. 光电编码器的原理及应用场合_旋转式光电编码器工作原理及在视觉检测中的使用...
  9. Oracle 存储大文本
  10. Shape Shifter——制作简单动画
  11. 电脑ping,电脑ping如何打开 电脑ping打开教程
  12. 镜头焦距与拍摄距离以及拍摄范围的关系
  13. python3斐波纳契数列
  14. centos7 离线安装 rar 解压缩软件
  15. Linux运维学习路径全解析
  16. SSO单点登录详解------三、单点注销流程解析
  17. RTX4060参数 RTX4060功耗 RTX4060 显卡性能
  18. 撕开的黎明--孔庆东卷
  19. 怎么把foxmail的邮件和服务器同步,foxmail客户端导入邮件但是网页端没有同步,怎么处理呢[foxmail]-上海腾曦网络...
  20. HDU 5172 GTY's gay friends HASH随机算法

热门文章

  1. 每日力扣——95. 提莫攻击
  2. 【上古秘籍】之Eclipse的秘籍
  3. java 杨辉三角(贾宪三角,帕斯卡三角)
  4. Phonics 自然拼读法 c/k,e,h,r,m,d Teacher:Lamb
  5. uniapp接入微信客服聊天流程(企业微信)
  6. 毕业论文查重怎么操作?
  7. 用淘汰的手机做家庭监控
  8. 2011年在深圳的国庆
  9. Linux期末考试复习大纲
  10. CSAPP Final Exam Preparation: reading solution records (2b continued)