学习web前端第一天-图片路径

最新推荐文章于 2024-05-12 13:16:00 发布

qq_39449982

最新推荐文章于 2024-05-12 13:16:00 发布

阅读量352

点赞数 1

分类专栏：前端学习文章标签：前端 html css

本文链接：https://blog.csdn.net/qq_39449982/article/details/121531058

版权

前端学习专栏收录该内容

9 篇文章 0 订阅

订阅专栏

目标：

1.能够说出网页的基本组成
2.能够说出什么是HTML
3.能够说出常用的浏览器
4.能够说出web标准的三大组成部分

src 图片路径

    art     文本  替换文本，图像不能显示的文字
    title   文本  提示文本，鼠标放到图像上，显示的文字
    width   像素  设置图像的宽度
    height  像素  设置图像的高度
    border  像素  设置图像的边框粗细 一般通过css属性设置-->

相对路径

    同一级路径  <img src="img.jpg">
    下一级路径  <img src="img/img.jpg">
    上一级路径  <img src="../img.jpg">
    绝对路径
    <img src="D:\BaiduNetdiskDownload\资料 -前端小白零基础入门HTML5+CSS3\01-前端基础第一天-HTML\案例\images/img.jpg"
    或者完整的网络地址 http://baidu.com/nihao.png

<a href="跳转目标" target="目标窗口的弹出方式">文本或图像</a>

target _self为默认值 _blank为在新窗口中打开方式
1.外部链接 "http://baidu.com" 
2.内部链接 "xxx.html" 
3.空连接"#"
4.下载链接 地址链接的是文件 .exe 或 .zip等压缩包形式
5.网页元素链接 在网页中的各种网页元素，如文本、图像、表格、音频、视频等可以添加超链接 <a href="跳转目标" target="目标窗口的弹出方式"> <img src="img.jpg"></a>
6.锚点链接 点我们点击链接，可以快速定位到页面中的某个位置
    在连接文本的href属性中，设置属性值为#名字的形式，如<a href="#two">第二季</a>
    找到目标位置标签，里面添加一个id属性=刚才的名字，如:<h3 id="two">第二季介绍</h3>
    注释 ctrl+/  特殊字符+-*/  有字符的代码  &nbsp；空格  其余用到自行查找

–>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <strong>加粗</strong><b>加粗</b>    
    <em>倾斜</em><i></i>
    <del>删除线</del><s></s>
    <ins>下划线</ins><u></u> 
    <div>独占一行（大盒子）</div>
    <span>一行有多个（小盒子）</span>
    <img src="img/img.jpg" alt="图片" title="周润发" width="200px" height="300px" border="2px">

</body>
</html>

qq_39449982

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
学习web前端第一天-图片路径

目标：1.能够说出网页的基本组成2.能够说出什么是HTML3.能够说出常用的浏览器4.能够说出web标准的三大组成部分src 图片路径 art 文本替换文本，图像不能显示的文字 title 文本提示文本，鼠标放到图像上，显示的文字 width 像素设置图像的宽度 height 像素设置图像的高度 border 像素设置图像的边框粗细一般通过css属性设置-->相对路径同一级路径 <img
复制链接

扫一扫