HTML基础

Coder_R
155 阅读1分钟

一、基础认识

image.png

image.png

image.png

image.png

image.png

image.png

表示加粗

image.png

image.png

image.png

image.png

image.png

image.png 企业最流行的开发工具：VScode ：免费 体积小，支持插件（开发效率高）

image.png

网页骨架：英文的!+回车

默认浏览器中运行网页文件，及快捷键

image.png

image.png

image.png

image.png

image.png 取消注释：再按次ctrl+/

image.png

image.png

image.png

二、HTML标签学习

image.png

选中相同字：ctrl+d

image.png

image.png

image.png

MH%D(O223NI8T2{J3_8PT}X.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png 当图因特殊情况不显示时，显示“alt”中的替换文本。当图显示时，不显示“alt”中的替换文本。

image.png

image.png 宽、高只用写一个，另一个等比例缩放。

image.png

image.png 网址不常用。 复制图片所在绝对路径后（当前所在文件夹位置），添加“+图片名及后缀”

image.png

image.png 下级是图片在网页文件的下级 image.png 上级是图片在网页文件的上级 ， “../+图片名+后缀” image.png

image.png

image.png

image.png

image.png

image.png

image.png “./”+自主选择网页链接即可。

image.png

image.png 先打开index.html——网页首页

image.png 列表用在内容规整情况下

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

表单使用情况：登录、注册、搜索

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

手机端标签 image.png image.png

8241C[XJT]R$L1PN~OM0_(K.png

image.png

综合案例-表格 image.png

image.png

综合案例-表单

image.png

avatar
文章
阅读
粉丝