#WEB前端(HTML属性)

1.实验:a,img


2.IDE:VSCODE


3.记录:

a:

href插入超链接

默认情况下在本窗口打开链接,

target可以设置打开的窗口,parent在父窗口打开,blank新开串口打开,top在顶层串口打开,self为默认在本窗口打开

img:

插入图片

可以插入图片链接(src)和加载失败时显示的内容(alt)

可以设置图片的宽和高

运行效果:


4.代码:

html 复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>HTML属性</title>
</head>
<body>
    <a href="https://docs.geeksman.com">极客侠网址</a>                           <!超链接,默认为_self(在本窗口打开超链接)>
    <p><a href="https://docs.geeksman.com" target="_blank">在新窗口打开极客侠网址</a></p>
    <p><a href="https://docs.geeksman.com" target="_parent">在父窗口打开极客侠网址</a></p>     <!target规定在哪个窗口打开超链接>
    <p><a href="https://docs.geeksman.com" target="_self">在本窗口打开极客侠网址</a></p>
    <p><a href="https://docs.geeksman.com" target="_top">在顶层窗口打开极客侠网址</a></p>
    <hr>                                    <!分割线>
    <! src为图片的链接,alt为图片无法加载时显示的内容>
    <img src="https://ts4.cn.mm.bing.net/th?id=OIP-C.fFLzAD27IMu3Y07d2l2nIAHaLH&w=204&h=306&c=8&rs=1&qlt=90&o=6&dpr=1.4&pid=3.1&rm=2" alt="图片加载出错">                
    <hr>
    <img src="超级马里奥.jpg" alt="出错了">                            <!DOCTYPE html 直接加载同一路径下的图片>
    <hr>
    <img src="超级马里奥.jpg" alt="出错了" width="400" height="200">   <!DOCTYPE html 直接加载同一路径下的图片,设置显示的宽度和高度>
</body>
</html>
相关推荐
MonkeyKing71552 小时前
Flutter状态管理实战:全局、局部、页面状态拆分指南
前端·flutter
Panzer_Jack2 小时前
Copiwaifu:一个和 Claude Code、Codex、Copilot 等 AI 编程工具联动的 Live2D 桌宠[特殊字符]
前端·人工智能·copilot·web·live2d·pixi.js·easy-live2d
开源情报局3 小时前
从小红书评论区挖需求:我准备用 opencode 写一个 Chrome 插件
前端·javascript·chrome
用户125758524363 小时前
XYGo Admin 三级权限体系:RBAC 动态路由 + v-auth 按钮控制 + 字段级过滤全解析
前端
小李子呢02113 小时前
前端八股JS---Map / Set / WeakMap / WeakSet
开发语言·前端·javascript
冴羽3 小时前
3 招让你的 Shadcn 出海应用性能提升 40 倍
前端·javascript·next.js
中议视控3 小时前
网络中控系统通过推流软件实现可视化:RTSP,H265,WEB等推流
前端·网络
Hsuna3 小时前
Tailwind CSS 比起传统CSS框架无法实现的一些功能
前端·react.js
SilentSamsara3 小时前
装饰器基础:从闭包到装饰器的自然演变
开发语言·前端·vscode·python·青少年编程·pycharm