零基础怎么用HTML做个简单网页?手把手教你!HTML入门,零基础打造个人简单网页教程
"哎我说,现在谁还不会做个网页啊?" 前两天听见同事老张在茶水间吹牛,刚毕业的小王愣是憋得满脸通红。其实吧,咱要搞懂HTML做网页,就跟学骑自行车似的,看着难,上手就会。今天就带大家用最接地气的方式,把这事儿整明白!
一、先整明白网页的骨架是咋回事
你知道吗?每个网页都有个标配的"三件套"——就像人要有头有身子。打开记事本(对,就是windows自带的那个!),敲下面这段:
html运行复制html><html><head><title>我的第一个网页title>head><body>这里放要显示的内容body>html>
保存成.html文件,双击打开就能看见浏览器里显示的字了。这里头,相当于身份证,就是展示给大伙儿看的真身。
二、给网页穿衣服的必备标签
- 标题不能少
从到六个级别,就跟写作文的标题似的。举个例子:
html运行复制<h1>欢迎来到我的小破站h1><h2>今日推荐h2>
这里有个坑要注意:千万别拿标题当放大镜用,人家是给搜索引擎看的。
- 段落要分家
标签就是天然的分段符。比如:
html运行复制<p>今天天气真好p><p>适合出去浪p>
但你要是偷懒不分段,整个网页就会变成一坨字,跟老太太的裹脚布似的。
- 重点要突出
用加粗、斜体,比用和更符合现在的标准。举个栗子:
html运行复制<strong>注意!strong>今天<em>不加班em>
这样既能让重点跳出来,又对搜索引擎友好。
三、整点高级玩意
- 链接跳转
文字这个组合必须记住。比如:
html运行复制<a href="https://baidu.com">有问题找度娘a>
要是想在新窗口打开,加个target="_blank"就成,跟开新tab一个道理。
- 图片插入
这个标签,新手最容易栽在路径上。记住啊:
- 同一文件夹直接写文件名
- 子文件夹要加文件夹名/
- 上级目录得用../
去年我徒弟就因为路径写错,把公司logo显示成表情包,差点被开除。
- 列表整理
买东西清单用,步骤说明用:
html运行复制<ul><li>鸡蛋li><li>牛奶li>ul><ol><li>打开冰箱li><li>拿出食物li>ol>
这可比用顿号看起来专业多了,就跟超市货架似的整整齐齐。
四、 *** 翻车现场
去年有个哥们儿做企业官网,表格 *** 活对不齐。后来发现是忘了写,整个页面跟车祸现场似的。这里教你们个绝招:
html运行复制<table><tr><th>商品th><th>价格th>tr><tr><td>苹果td><td>5元td>tr>table>
记住是表头,会自动加粗居中,千万别拿凑合。
五、个人观点时间
要我说啊,学HTML就跟学做菜一样,别老盯着菜谱看,得真下锅炒两下。见过太多人抱着《HTML大全》啃半年,结果连个简单的登录框都写不出来。建议你们:
- 每天就学两三个标签
- 自己瞎改代码看效果
- 遇到报错先别慌,F12开发者工具能救命
最后送你们句话:网页做丑了没关系,能用就行;代码写乱了不要紧,能跑就行。重要的是迈出第一步,剩下的,浏览器会帮你兜着!