HTML-标签

于 2022-06-29 06:03:38 发布
阅读量1k 收藏 7
点赞数 2
文章标签： html 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qianshuiliyu/article/details/125513031
版权

标签

标签必须是封闭的，标签由自封闭的和半封闭的
半封闭：成对出现的，如<div></div>，第一个标签是开始，第二个是结束，结束的标签带有斜杠
自封闭：单独出现的标签，如<br>，<hr>等

标签属性：控制标签的显示，高度、宽度、颜色等，标签可以没有属性（就是不写）
有些标签的属性自带一些特殊效果，有些没有
标签语法：
<标签名 属性1=“属性值1” 属性2=“属性值2”…>内容部分</标签名>
<标签名 属性1=“属性值1” 属性2=“属性值2”…>

00、注释

在pycharm编辑器中，找到一行内容ctrl+/就能注释，注释的内容不会在网页上显示出来

<!--我是注释-->

注释在网页查看的时候并不会显示，一般用来给开发人员看的，标注
在这里插入图片描述

01、!DOCTYPE

<!DOCTYPE> 必须写在是 HTML 文档的第一行，位于 标签之前， 声明浏览器关于页面使用哪个 HTML 版本进行编辑

<!DOCTYPE html>
html声明用的是html5标准

03、head中的常用标签

序号标签说明
01<title></title>定义网页标题
02<style></style>定义内部样式
03<script></script>定义JS代码或引入外部JS文件
04<link>引入外部样式表文件
05<meta>定义网页原信息

01、title标题

<!DOCTYPE html>

<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>我是title标题</title>
</head>
<body>
<h1>你好，我是h1标题</h1>
<!--我是注释-->
</body>
</html>

在这里插入图片描述
在这里插入图片描述

05、meat元数据

meat标签可提供有关页面的元信息（meta-information）,针对搜索引擎和更新频度的描述和关键词；位于文档的头部，不包含任何内容；提供的信息是用户不可见的
mean标签的组成，有http-equiv属性和name 属性
mean标签可以写多个

① http-equiv属性，相当于http的文件头作用，向浏览器传递信息，以帮助正确地显示网页内容
content中的内容其实就是各个参数的变量值
url，统一资源定位器，就是我们说的网址

⑴、跳转对应的地址

http-equiv=“refresh” content=“3;URL=https:www.baidu.com”
3秒刷新一次页面，写上url之后，3秒后在原页面跳转到url对应的地址，跳转过去就与原页面无关了

<!DOCTYPE html>

<html lang="en">
<head>
    <meta http-equiv="refresh" content="3;URL=https:www.baidu.com">
    #把URL和后面的地址去掉就是没2秒刷新一次页面，加上就是在原页面跳转到URL指向的地址，与之前页面无关了
    <title>我是title标题</title>
</head>
<body>
<h1>你好，我是h1标题</h1>
</body>
</html>

⑵、 指定网页的编码类型
存在中文网页内容需要指定编码，不同浏览器默认编码不同（如360浏览器默认gbk编码），可能会出现乱码

<!DOCTYPE html>

<html lang="en">
<head>
    <meta http-equiv="content-type" charset="UTF-8">
    <title>我是title标题</title>
</head>
<body>
<h1>你好，我是h1标题</h1>
</body>
</html>

在这里插入图片描述
在这里插入图片描述
⑶、指定IE以最高级模式渲染文档
主要是IE的渲染与其他浏览器有较大的不同，所以在制作前端页面要注意浏览器的兼容性问题
实际上看上去没啥效果

<!DOCTYPE html>

<html lang="en">
<head>
    <meta http-equiv="x-ua-compatible" content="IE=edge" charset="UTF-8">
    <title>我是title标题</title>
</head>
<body>
<h1>你好，我是h1标题</h1>
</body>
</html>

② name 属性

name主要用于描述网页，content中的内容主要是便于搜索引擎机器人查找信息和分类信息用的，对文档的描述，可以在百度的页面上通过F12查看，当然百度做了很多修饰

自己写的没有收集在百度中，所以看不到效果,下面截了个淘宝的图

<!DOCTYPE html>

<html lang="en">
<head>
    <meta charset="UTF-8" name="淘宝网" content="淘宝网，中国最大电子交易网站">
    <title>我是title标题</title>
</head>
<body>
<h1>你好，我是h1标题</h1>
</body>
</html>

在这里插入图片描述
在这里插入图片描述

4、body中的标签

00、标签分类

内敛标签（行内标签）：不换行
块级标签（行外标签）：独占一行
html标签全称：超文本标记语言，就是标记用的，在内容上加上标签，显示对应的效果，标签有是自封闭和半封闭

div标签单独占一行，里面的东西没有任何效果，所以是使用最多的，通过标签进行页面设置，美观等
span标签没有任何效果，也不独占一行

嵌套标签，块级标签

<div>
    <div>div1</div>
    <div>div2</div>
</div>

内敛标签只能嵌套内敛标签，块级标签可以嵌套内敛标签和部分块级标签
p标签不能嵌套块级标签，p标签不能嵌套p标签
所有标签在浏览器中都被称为元素

01、b 加粗

<body>
我是文字
<b>我是文字</b>
</body>

在这里插入图片描述

02、i 斜体

<body>
我是文字
<i>我是文字</i>
</body>

在这里插入图片描述

03、u 下划线

<body>
<u>我是文字</u>
</body>

在这里插入图片描述

04、s 删除线

<body>
<s>我是文字</s>
</body>

在这里插入图片描述

05、p 段落

独占一行，
p标签比较特殊，不能包含块级标签，p标签也不能包含p标签。可以试一下p标签套p标签，f12你会发现三个p标签，标签都是单独的，嵌套无效

<body>
我是文字
<p>我是段落</p>
我是文字
</body>

在这里插入图片描述
⑴嵌套问题
在这里插入图片描述

在这里插入图片描述

06 H 标题

块级标签，从标题1到标题6，之后的不存在，就是普通文本了

<body>
<h1>标题1</h1>
<h2>标题2</h2>
<h3>标题3</h3>
<h4>标题4</h4>
<h5>标题5</h5>
<h6>标题6</h6>
<h7>标题7</h7>
</body>
</html>

在这里插入图片描述

07、br 换行

在这里插入图片描述

08、hr 水平线

块级标签
水平线，单独占一行

<body>
床前明月光，<hr>疑是地上霜
床前明月光，疑是地上霜
<hr>
</body>

在这里插入图片描述

09、特殊字符

直接百度搜HTML特殊符号对照表
http://www.fhdq.net/ts/177.html

符号说明符号说明
&nbsp;空格

后续在补充

10、div与span

div独占一行，span不独占一行
div是块级标签
没有什么效果，是这两个标签最大的效果，主要通过CSS样式为其赋予不同的表现效果

<body>
<div>床前明月光，疑是地上霜</div>床前明月光
<span>床前明月光，疑是地上霜</span>床前明月光
</body>

在这里插入图片描述

11、img图片

img内敛标签

.当前目录
…父目录（上一级目录）

属性说明
src图片路径，路径分为绝对路径和相对路径
alt图片未加载成功提示的信息
title鼠标悬浮时提示信息
width宽度，默认单位像素px，高和宽只设置其中一个，会自动等比缩放
height高度

⑴相对路径的图片

<body>
<img src="图片.jpg" alt="这是图片" title="我是图片" width="100" height="200">
</body>

在这里插入图片描述
⑵网络图片地址
网络地址获取，搜索图片，f12查看地址，双击网络地址，将地址复制过去

在这里插入图片描述

<img src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fb-ssl.duitang.com%2Fuploads%2Fitem%2F201810%2F14%2F20181014154202_pgazq.jpg&refer=http%3A%2F%2Fb-ssl.duitang.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1657618193&t=796da1b241934b14be48fc7285386a2e" alt="这是图片" title="我是图片" height="200" width="200">
</body>

在这里插入图片描述
⑶本地绝对路径
通过socket打开失败，直接打开成功
原因：web服务器上的网络资源的地址定位是相对于网站根目录
在这里插入图片描述

本地跨分区加载图片通过file协议加载，否则可能无效，取决于浏览器

<img src="file:///c:/图片.jpg" alt="这是图片" title="我是图片" height="200" width="200">

⑷加载不出图片时的显示

<body>
<img src="" alt="这是图片" title="我是图片" height="200" width="200">
</body>

在这里插入图片描述

12、a 超链接

从一个网页指向一个目标的连接关系，这个目标可以是另一个网页，也可以是相同网页上的不同位置，一个图片，一个电子邮件地址，一个文件，一个应用程序等等
内敛标签，默认在源页面进行跳转

绝对URL ：指向另一个站点
相对URL：指当前站点中确切的路径
锚URL：指向页面中的锚（href=“#top”），跳转尾部，首部等

属性说明
target=“_blank”在新窗口打开链接
target="_self默认属性，在当前页面跳转

⑴跳转对应地址

<body>
<a href="www.baidu.com">跳转到百度</a>
</body>

在这里插入图片描述
⑵跳转本页面的位置

<body>
<a href="#div01">跳转到尾部</a>
<div>我是头部</div>
<img src="图片.jpg" alt="" height="1000">
<div id="div01">我是尾部</div>
</body>

13、ul 无序列表

HTML5不再支持

  • type 属性，使用 CSS替代，虽然弃用，但目前还是支持的
    ul无序列表，通过li标签来定义列表选项

⑴ 直接指明type属性，这种已经弃用了，可能还支持，尽量不要使用

<ul type="circle">
    <li>01</li>
    <li>02</li>
</ul>

在这里插入图片描述

⑵通过style或css设置

<ul style="list-style-type: disc">
    <li>01</li>
    <li>02</li>
</ul>

在这里插入图片描述

type属性说明type属性说明
disc默认，实心圆circle空心圆
none无标记square实心方块
decimal数字decimal-leading-zero0开头的数字标记。(01, 02, 03, 等)
lower-roman小写罗马数字upper-roman大写罗马数字
lower-alpha小写英文字母upper-alpha大写英文字母
lower-greek小写希腊字母lower-latin小写拉丁字母(a, b, c, d, e, 等。)
upper-latin大写拉丁字母(A, B, C, D, E, 等。)hebrew传统的希伯来编号方式
armenian传统的亚美尼亚编号方式georgian传统的乔治亚编号方式(an, ban, gan, 等。)
cjk-ideographic简单的表意数字hiragana标记是：a, i, u, e, o, ka, ki, 等。（日文平假名字符）
katakana标记是：A, I, U, E, O, KA, KI, 等。（日文片假名字符）hiragana-iroha标记是：i, ro, ha, ni, ho, he, to, 等。（日文平假名序号）
katakana-iroha标记是：I, RO, HA, NI, HO, HE, TO, 等。（日文片假名序号）

14、ol 有序列表

ol标签是有序列表，通过li定义列表的选项

<ol type="1" start="2">
    <li>床前明月光</li>
    <li>疑是地上霜</li>
</ol>

在这里插入图片描述
在这里插入图片描述

type属性说明
11 数字列表，默认值， start是从数字第几个开始
A大写字母
a小写字母
Ⅰ大写罗马
i小写罗马

15、dl 标题列表

dl标题列表，dt定义一级，dt定义二级
多重可以进行嵌套，在dd中写dl

<dl>
    <dt>床前明月光</dt>
    <dd>疑是地上霜</dd>
    <dt>举头望明月</dt>
    <dd>低头思故乡</dd>
</dl>

在这里插入图片描述

16、table 表格

网页中的Excel表格

属性说明属性说明
cellpadding内边距 （内边框和内容的距离）border表格边框
cellspacing外边距.（内外边框的距离）width像素 百分比.（最好通过css来设置长宽）
rowspan单元格竖跨多少行colspan单元格横跨多少列（即合并单元格）
  1. thead，第一行的标题，加粗加黑的，自动居中
  2. th，在标题中的行
  3. tr，一行
  4. td，一个单元格
  5. tbody，内容部分，tr与td，不写也没啥区别

⑴基本表格

<table border="1">
    <thead>
    <tr><!--标题-->
        <th>班级</th>
        <th>姓名</th>
        <th>学号</th>
    </tr>
    </thead>
    <tbody>
        <tr>
        <td>1班</td>
        <td>张三</td>
        <td>001</td>
    </tr>

在这里插入图片描述
⑵边距控制

<table border="5" cellpadding="10" cellspacing="20">
    <thead>
    <tr><!--标题-->
        <th>班级</th>
        <th>姓名</th>
        <th>学号</th>
    </tr>
    </thead>
    <tbody>
        <tr>
        <td>1班</td>
        <td>张三</td>
        <td>001</td>
    </tr>

在这里插入图片描述

⑶合并单元格

<table border="5" cellpadding="10" cellspacing="20">
    <thead>
    <tr><!--标题-->
        <th>班级</th>
        <th>姓名</th>
        <th>学号</th>
        <th>邮箱</th>
    </tr>
    </thead>
    <tbody>
        <tr>
        <td rowspan="2">1班</td>
        <td>张三</td>
        <td>001</td>
        <td>12345@qq.com</td>
        <tr>
        <td>1班</td>
        <td colspan="2">李四</td>
        <td>002</td>
        <td>123456@qq.com</td>
    </tr>
    </tbody>
</table>

在这里插入图片描述

17、input 用户输入

input配合form使用
不同的属性会有不同的变化

属性说名属性说明
text单行输入文本password密码输入框（不显示明文）
date日期输入框，年月日checkbox复选框
radio单选框submit提交按钮，#发送浏览器上输入标签中的内容，配合form表单使用，页面会刷新
reset重置按钮，页面不会刷新，将所有输入的内容清空datetime-local年月日时分
button普通按钮,安着玩的，没别的效果hidden隐藏输入框
file文本选择框month年月
number数字，通过属性设置可以对数字进行限定range一定范围内数字值的输入，range 类型显示为滑动条
search搜索域tel电话号码
time时间urlURL地址
week周和年color颜色选择

属性说明：

  1. value：表单提交时对应项的值
  2. type=“button”, “reset”, "submit"时，为按钮上显示的文本年内容
  3. type=“text”,“password”,"hidden"时，为输入框的初始值
  4. type=“checkbox”, “radio”, “file”，为输入相关联的值
  5. checked：radio和checkbox默认被选中的项
  6. readonly：text和password设置只读，不能输入数据，readonly数据可以提交到后台
  7. disabled：所有input均适用，disable是禁用，不允许操作，disable数据提交不到后台
  8. name：表单提交时的“键”，注意和id的区别，id是标识唯一的HTML元素
⑴text 单行文本
用户名<input type="text">

在这里插入图片描述

⑵ password 加密
用户名 <input type="text">
密码 <input type="password">

在这里插入图片描述
默认值

<input type="text"  name="x" value="admin"> 用户名
<input type="password"  name="x" value="123456"> 密码

在这里插入图片描述

⑶date 日期输入框
用户名 <input type="text">
密码 <input type="password">
时间 <input type="date">

在这里插入图片描述

⑷radio 单选

单选就得指定name，相同name名字的的是一组，只能选择一个
name是表单提交时的“键”
value 属性可设置或返回单选按钮的 value 属性的值
value如果没有设置，则默认value的值是“on”

<input type="radio"  name="x"> 男
<input type="radio"  name="x"> 女

在这里插入图片描述
默认值checked
checked是默认选择项，属性名与属性值相同时可以简写为checked，多个以最下面的为准，在多选中就是多个

<input type="radio" name="性别" value="1" checked="checked">男
<input type="radio" name="性别" value="2">女

在这里插入图片描述

<!--简写-->
<input type="radio" name="性别" value="1" checked>男
<input type="radio" name="性别" value="2">女
⑸checkbox 复选框

指定name相同的是一组，才能进行多选，要不相互之间没关系
checked是默认选择项，属性名与属性值相同时可以简写，多个以最下面的为准，在多选中就是多个

<input type="checkbox"  name="x"> 1号
<input type="checkbox"  name="x"> 2号
<input type="checkbox"  name="x"> 3号
<input type="checkbox"  name="x"> 4号

在这里插入图片描述
默认选项

<!--简写-->
<input type="checkbox"  name="x" checked> 1号
<input type="checkbox"  name="x" > 2号
<input type="checkbox"  name="x" checked> 3号
<input type="checkbox"  name="x"> 4号

在这里插入图片描述

⑹submit 提交按钮

在当前form表单所有内容全部提交，不分上下，按钮名字可以叫别的，通过value指定名字

普通按钮

<input type="text"  name="x"> 用户名
<input type="password"  name="x"> 密码
<input type="submit">

在这里插入图片描述
自定义按钮名字

<input type="text"  name="x"> 用户名
<input type="password"  name="x"> 密码
<input type="submit" value="我要提交">

在这里插入图片描述

18、form 表单

HTML表单是HTML元素中较为复杂的部分，表单往往和脚本、动态页面、数据处理等功能相结合，因此它是制作动态网站很重要的内容，表单一般用来收集用户的输入信息

表单工作原理：访问者在浏览有表单的网页时，可填写必需的信息，然后按某个按钮提交。这些信息通过Internet传送到服务器上（数据库）。 服务器上专门的程序对这些数据进行处理，如果有错误会返回错误信息，并要求纠正错误。当数据完整无误后，服务器反馈一个输入完成的信息

表单能够包含input系列标签，比如文本字段、复选框、单选框、提交按钮等等
表单还可以包含textarea、select、fieldset和 label标签
form表单提交数据的时候，必须有个submit按钮

accept-charset规定在被提交表单中使用的字符集（默认：页面字符集）。
action规定向何处提交表单的地址（URL）（提交页面）。（提交数据的地址，写url路径）
autocomplete规定浏览器应该自动完成表单（默认：开启）。
enctype规定被提交数据的编码（默认：url-encoded）。
method规定在提交表单时所用的 HTTP 方法（默认：GET），get或post
name规定识别表单的名称（对于 DOM 使用：document.forms.name）（分组，携带数据的key）
novalidate规定浏览器不验证表单
target规定 action 属性中地址的目标（默认：_self）

打开python的socket进行测试

import socket
server=socket.socket()
server.bind(('127.0.0.1',80))
server.listen()
while 1:
    conn,addr=server.accept()
    frpm_browser_msf=conn.recv(1024).decode('utf-8')
    print(frpm_browser_msf)

    conn.send(b'HTTP/1.1 200ok\r\n\r\n')
    with open('html.html',mode='rb') as  f:
        html=f.read()
    conn.send(html)
    conn.close()

⑴ 用户名密码提交
在这里插入图片描述
在这里插入图片描述

socket上接收到的数据
在这里插入图片描述
⑵选择框提交
没有name，提交不知道给谁，指定name，但是选择框变成on了，选择框需要指定value，没有value没数据，输入框的valus是默认值，但以用户输入的为主提交，单选多选都写
（让用户选择的，必须指定一个value值，要不然后端接收不到内容，用户自己填写的标签，不需要指定value值）

没有指定valve，后面看不到

<form action="http://127.0.0.1:80">
    <input type="text" name="username"> 用户名
    <input type="password" name="passwd"> 密码
    <input type="submit" value="登录"><br>
    <input type="radio" name="sex"> 男
    <input type="radio" name="sex"> 女
</form>

在这里插入图片描述
指定valve

<form action="http://127.0.0.1:80">
    <input type="text" name="username"> 用户名
    <input type="password" name="passwd"> 密码
    <input type="submit" value="登录"><br>
    <input type="radio" name="sex" value="1"> 男
    <!--使用数字代指。节省数据库空间-->
    <input type="radio" name="sex" value="2"> 女
</form>

⑶post请求
表单默认是get请求，并且如果内容很多的话，你的地址栏不能够输入那么长的内容
post会把所有你提交的信息封装到一个消息体里面，在浏览器上就看不到了，相对安全

getpost
get请求一般用来请求获取数据post请求一般作为发送数据到后台，传递数据，创建数据
get请求也可以传参到后台，但是传递的参数则显示在地址栏，安全性低，且参数的长度也有限制（2048字符）post请求则是将传递的参数放在request body中，不会在地址栏显示，安全性比get请求高，参数没有长度限制
3、get请求刷新浏览器或者回退没有影响post请求则会重新请求一遍
get请求可以被缓存，也会保留在浏览器的历史记录中post请求不会被缓存，也不好保留在浏览器的历史记录中
get请求通常是通过url地址请求post常见的则是form表单请求

在这里插入图片描述
post请求不显示，数据在消息体传回后端

<form action="http://127.0.0.1:80" method="post">
    <input type="text" name="username"> 用户名
    <input type="password" name="passwd"> 密码
    <input type="submit" value="登录"><br>
    <input type="radio" name="sex" value="1"> 男
    <input type="radio" name="sex" value="2"> 女
</form>

在这里插入图片描述
⑷提交图片
图片丢失问题

<!--提交地址代码-->
<form action="http://127.0.0.1:80">
  <input type="text" name="username">
  <input type="submit">
</form>

<!--接收地址代码-->
<img src="图片.jpg" alt="美女" width="300" height="300">
<form action="http://1127.0.0.1:80">
    <input type="text" name="username" id="username"> 用户名
    <input type="password" name="passwd" id="passwd"> 密码
    <input type="submit" name="2" id="提交">
</form>

通过运行socket,图片请求到此地址，图片丢失
在这里插入图片描述
在这里插入图片描述

在这里插入图片描述

原因：浏览器socket加载通过地址：http://127.0.0.1:80/图片.jpg去寻找的，服务端收到数据没有回复，而网页中的是相对路径没有地址，相对路径加载到浏览器中显示是加上IP地址+相对图片，所以失败

打开网页用pycharm提供的socket去打开

19、select 下拉选择

value在这里一样跟上面input，不一样在你没有写值，会把文本提交过去，input是on，但是一般不会这样设置

属性说明
multiple布尔属性，设置后为多选下拉框，否则默认单选
disabled禁用
selected默认选中该项
value定义提交时的选项值
<form action="http://127.0.0.1:80" method="post">
    <select name="城市" id="城市">
        <option value="1">北京</option>
        <option value="2" selected>上海</option>
        <!--selected默认 -->
        <option value="3">广州</option>
    </select>
</form>

在这里插入图片描述

下拉多选
按住Ctrl进行多选

<form action="http://127.0.0.1:80" method="post">
    <select name="城市" id="城市" multiple>
        <option value="1">北京</option>
        <option value="2" selected>上海</option>
        <!--selected默认 -->
        <option value="3">广州</option>
    </select>
</form>

在这里插入图片描述

20、label 标识标签

label 标签为 input元素定义标注（标记）。如果不用这个label给input标签一个标记，input会变黄，不影响使用，只是提示你，别忘了给用户一些提示，也就是这个label标签。
标识标签功能

  1. label 元素不会向用户呈现任何特殊效果。但是点击label标签里面的文本，那么和他关联的input标签就获得了光标，让你输入内容
  2. label 标签的 for 属性值应当与相关元素的 id 属性值相同。
<form action="http://127.0.0.1:80" method="post">
    <label for="username">用户名</label> 
    #for和input的id属性一样，就关联在一起了
    <input id="username" type="text" name="userneme" value="张三" readonly>
    <!--id指向for的username，id标识input标签-->
</form>

在这里插入图片描述

第二种写法，两种写法效果一样

<form action="http://127.0.0.1:80" method="post">
    <label>
        用户名<input type="text" name="username" value="张三" readonly>
    </label>

</form>

在这里插入图片描述

21、textarea 多行文本

属性说明
name名称，提交使用
rows行数 #相当于文本框高度设置
cols列数 #相当于文本框长度设置
disabled禁用
maxlength显示字符数，例如：maxlength=‘10’ 最多输入十个字符
<textarea name="评论区" id="1" cols="30" rows="10" ></textarea>

在这里插入图片描述

浅水鲤鱼
关注
  • 2
    点赞
  • 踩
  • 7
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
HTML5入门
cyrilcloud的博客
03-28 467
HTML5入门一、网页开发工具1、VSCode的使用2、VSCode推荐插件3、VSCode 工具生成骨架标签新增代码3.1、文档类型生命标签3.2、lang 语言种类3.3、字符集二、web标准1、为什么需要Web标准2、web标准的构成三、HTML语法规范四、HTML标签1、HTML基本结构标签2、HTML常用标签2.1、标签语义2.2、标题标签3、段落和换行标签3.1、段落标签3.2、换行标签4、文本格式化标签5、div和span标签6、图像标签和路径6.1、图像标签6.2、路径6.2.1、路径之相对
html无效果的标签,没有实际作用只用于添加CSS样式的HTML标签
weixin_39818550的博客
06-05 1886
哪个HTML标签对它周围的文本没有任何作用，它的唯一目的是创建一个“句柄”，以便能够将CSS应用到文本?嗯，快速的答案是，这要看情况。如果你的问题是只针对于某几个字的，那么你要找的html标签可能是span标签：你要添加样式的内容在选择正确的HTML标签时，需要考虑的一个重要方面是它的语义目的以及目标内容是 "块 "还是 "内联"。例如，如果您试图将一个完整的文本段落与周围的段落不同，那么在段落标...
css 定义 html 页标签 没有的属性 超级好用 看了你就会明白了
为活而生为生而活
11-26 760
 css中没有这些参数                 table{nolonely:expression(s(this))}               function   s(o){     with(o){     borderColorDark="#FFFFFF"     cellPadding=3     cellSpacing=0     }     }     //-->
HTML base标签不起作用的原因
u011159350的博客
07-11 930
到这里原因已经很明显，出问题的关键就是在“/“上，base标签的url必须末尾有“/”，而页面body中所有的链接第一个字符不能是“/"。本来想用html base标签，为所有url都添加相同的前缀地址http://localhost:8080/gerenweb。访问时生成的url链接：http://localhost:8080/am/amc01。接下来我做了一个小修改，在base标签href末尾添加了一个“/”，其他位置没做修改。超链接”添加动漫“也成功添加url前缀。但写完后死活链接加不上这个前缀。
html的无意义标签,HTML不常用的有用标签
weixin_36091906的博客
06-22 1277
1、HTML的标签设置默认链接2、列表设置不同颜色和3、标签规定了元素可能的选项列表。4、标签规定了用户可见的或者隐藏的 标签规定了用户可见的或者隐藏的需求的补充细节。5、标签可以将表单内的相关元素分组。6、表单标签用于创建供用户输入的 HTML 表单。元素包含一个或多个如下的表单元素： \ \ \ \ \ \ \ 是的内置选项如下：7、标签8、横线 标签9...
HTML
Java_script_的博客
07-27 505
标签 <head>：头标签，用于定义页面说明型或者功能型信息。如字符集、引入css样式、引入javascript功能等 <body>：身体标签，用于定义页面的展示型信息 <html>：相当于java类 类的大括号，把html的所有代码包裹起来 注解标签 格式：<!--注解内容--> 特点：浏览器不显示，查看源码可见；不能嵌套。...
HTML基础-标签的学习
12-05
本篇文章将详细介绍HTML的基础标签，特别是与列表、表格和表单相关的标签，以及字符实体和语义化标签。 首先，我们来看列表标签。列表在网页设计中广泛用于组织和呈现相关信息。主要有三种类型的列表： 1. **无序...
HTML5-标签集合.pdf
08-11
1、HTML5-标签集合；2、整合了常用的HTNL5的部分标签；3、用表格的形式展现HTML5标签；
12-表单标签.html
12-19
12-表单标签.html
06-超链接标签.html
12-19
06-超链接标签.html
前端开发知识点-HTML框架-标签
最新发布
09-18
前端开发知识点-HTML框架-标签
html中没有readonly属性的标签，变成只读的方法
燕儿尾的博客
08-23 830
asdas function selectReadOnly(selectedId){   var obj = document.getElementById(selectedId);      obj.onmouseover = function(){      obj.setCapture();     }     obj.onmouseout = function(){   
python3 修改html文件中标签的属性值
xiaoyao0574的博客
04-19 5494
** python3 修改html文件中标签的属性值** :----------因为python3中的highchart模块画图，感觉非常不错，用python的语言翻译javascript。 在实际开发过程中我们几乎或多或少地用到一些经典的js，把这些download到本地来引用，比一直用代理访问服务器方便很多。 于是为了引用down下来后的js，首先得修改html文件内的标签属性值。这...
html中用 \“ 显示双引号
chenchuwai的博客
07-31 2498
将双引号用\"代替 例子：alert(" \"测试\" ");
html map热点链接图像映射
zag666的博客
11-19 814
用html中的map属性实现 带有可点击区域的图像映射。 <img src="planets.jpg" border="0" usemap="#planetmap" alt="Planets" /> <map name="planetmap" id="planetmap"> <area shape="circle" coords="180,139,14" href...
HTML用法
qq_51764550的博客
03-29 117
HTML用法 1.标签 单标签 段落标签 加粗 段落换行 不常用标签 给文字增加删除线 把文字变成上标10^2 给文字加下划线 把文字居中 表格标签 图片标签 img->单标签 src :引入图片的地址 alt: 当图片出现问题的时候，可以显示一段友好的提示文字 title:提示信息 base-> 单标签：作用就是改变链接的默认行为 2.列表 无序列表 实心圆 type=“disc” 空
html 标签 无含义,html几个重要标签用法
weixin_29216957的博客
06-09 910
html几个重要标签用法(div,p,span,ul,li,dl,dt,dd,a,img,h,strong,em)XHTML里有很多的标签，我们经常用的也就不过那么几个，但是不经常用的也非常有用。下面我们一一列举：div,p,span,ul,li,dl,dt,dd,a,img,h,strong,em我一直认为div是一个框框，里面可以放很多东西。这个div是一个无意义快速性标签，没有什么特性的意义...
python 爬取<span></span>中间标签的内容
热门推荐
sxf_123456的博客
12-24 2万+
# python 爬取<span></span>中间标签的内容 html = """ <div> <span class='red'>item1</span> <div> <span id='s1'>item2</span> </div> </...
v-html动态添加标签
07-22
你可以使用 `v-html` 指令来动态添加标签。`v-html` 指令可以将一个字符串作为 HTML 解析并插入到元素中。请注意，这种方式需要非常谨慎，因为它可能导致跨站脚本攻击（XSS）的安全风险。 在 Vue 模板中，你可以使用 `v-html` 指令来动态添加标签。首先，你需要在 Vue 实例中定义一个数据属性，用于存储要插入的 HTML 字符串。然后，在模板中使用 `v-html` 指令并将数据属性绑定到元素上，Vue 将会解析并插入对应的 HTML。 以下是一个示例： ```html <template> <div> <div v-html="dynamicHTML"></div> </div> </template> <script> export default { data() { return { dynamicHTML: '<span>动态添加的标签</span>' }; } }; </script> ``` 在上述示例中，`dynamicHTML` 是一个数据属性，它包含了要插入的 HTML 字符串。通过使用 `v-html="dynamicHTML"`，Vue 将会解析并插入 `<span>动态添加的标签</span>` 到 `<div>` 元素中。 请记住，动态添加标签可能会引入安全风险，因此请确保你信任并且验证了要插入的 HTML 字符串。

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

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

浅水鲤鱼

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值