HTML网页结构

最新推荐文章于 2023-02-22 19:26:32 发布

外太空程序员

最新推荐文章于 2023-02-22 19:26:32 发布

阅读量201

点赞数

文章标签： html servlet java

本文链接：https://blog.csdn.net/qq_48516121/article/details/126973504

版权

<!doctype html>

<!--

文档类型声明作用：告诉浏览器按当前标准解析代码；

注意：HTML不区分大小写，双标记的结束标记可以省略，单标记的 / 可以省略，但是不推荐省略。

-->

<!--

字符集

中文开发网站常用utf-8，国外常用gbk

-->

<title>Document</title>

<!--

网页标题，一个网页只能有一个网页标题

-->

</head>

<body>

</body>

</html>

<!--

src（全称source:资源）路径：

1）绝对路径：

①网址直接去网页复制

②盘符图片在D盘中的位置

2）相对路径：

HTML文件去找图片

①平级直接写图片名称

②下一级英文状态下 / "images/img4.jpg"

③上一级在同一个项目里，../ "../img4.jpg"

④上两级在同一个项目里，../../(几级就几个这个)

Alt：图片不能正常显示时，给予用户一个提示

tilte：鼠标悬停时给予提示

width:设置元素的宽度

height:设置元素的高度

注意：图片宽高设置一个属性，等比例缩放；HTML默认单位为像素（px）

-->

1)、块级元素独占一行，行内元素在同一行显示

2)、块级元素默认宽度为100%，行内元素默认宽度由内容撑开

3)、块级元素：hn、 p、 hr

4)、行级元素：img

%：相对于父元素

-->

属性：

1、href: 路径

①绝对路径

②相对路径

href="#" 时为空连接：效果返回页面顶部（就是在页面最下面点击一下会返回到最上面打开的地方）

2、target:设置在哪个窗口打开（目标）

取值：

_self 默认值：原窗口打开

-blank 在新窗口打开 blank 空

3、name:名字（锚点：同一个页面做跳转）

①点击a跳转到a //两个超链接标签，使用name元素属性，另一个用#号＋name的值

②点击a跳转到块级元素 //一个超链接标签，一个块级标签，块级标签用id属性，超链接标签的href属性中填#号＋id的值

例题（点击a跳转到a）：

<a href="http://www.jxgy.com" name="santi">三体相关内容</a> //如果想点击“三体相关内容”出现网页就在href中添加地址，反之一样。

例题（点击a跳转到块级元素）：

<h1 id="santi">跳转到三体内容</h1>

注意：name只能给a标签加 id具有唯一性（像身份证一样）

超链接也属于行级元素

-->

</a>

快捷键：ul>li*6a[href=#]{写文本}

<ul>

</ul>

注意:ul包含li，所有内容写在li里面

<ul><li>的属性：

属性--type：设置项目符号

符号：

disc 默认值黑色实心圆

circle 空心圆

square 黑色实心矩形

none 不显示

例题：

</ul>

无序列表的嵌套使用方法：

<ul>

<li>写内容

<ul>

<li>

写嵌套的内容

</li>

</ul>

</li>

</ul>

有序列表(orederd list)：

属性--type:设置项目符号

--start:设置从数值几开始开始标号

--reversed:倒序标号

reversed="reversed" 当属性等于属性值，可以简写为属性 reversed

符号：1 A a i I

<ol>

</ol>

输入标签的快捷方式：

输入多个标签：用 *

嵌套标签：用 >

加上属性：用 [ ]

加上文字：用 { }

最后直接敲Table键自动补全

例题：ol>li*6>a[href=#]{发展历史}、

表格的作用：

表格主要用于显示、展示数据，因为它可以让数据现实的非常规整，可读性非常好。特别是后台展示数据的时候，能过熟练在运用表格就显得很重要。

<table>

<tr>

</tr>

<tr>

</tr>

<tr>

</tr>

</table>

外太空程序员

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
HTML网页结构

HTML网页结构
复制链接

扫一扫

HTML网页结构

“相关推荐”对你有帮助么？