HTML基础编辑

萌新zys

于 2021-07-27 11:34:11 发布

阅读量94

点赞数

本文链接：https://blog.csdn.net/weixin_58679791/article/details/119139031

版权

#1 常识

<title> html测试 </title> <!-- 设置网页的标题 -->
<body> <!-- 体信息，设置网页中要显示的内容 --></body>
&nbsp;可以在网页中实现空格
<br />换行

#2 常用标签

    <h1> 1级标签 </h1>
    <h6> 6级标签 </h6>
    <ol><li>有序列表</li></ol>
    <ul><li>无序列表</li></ul>
    <tr><td>文本</td></tr>

    <div></div>     换行
    <p></p>         换行并空一行
    <span></span>   不换行


    <table>表格</table>    表格需提交的话在table外增加<form></form>
    <form method="post" action="http://www.baidu.com"></form>    提交数据method="post"安全  get就显示在网址里

#3 常用按钮

 <input type="text"   placeholder="请输入姓名" name="username"/>   普通文本类型
    <input type="number" placeholder="请输入年龄" name="age"/>   数字类型
    <input type="password" name="pwd" />   密码，自动加密
    <input type="date" name="time />   日历表年月日
    <input type="week" />  带周日历表
    <input type="radio" name="sex" value="1" />男   单选框 必须设置value，否则提交on
    <input type="checkbox" name="like" value="1"/>篮球  多选框
    <input type="button" value="重置"/>  重置
    <input type="submit" value="提交" />    提交 
    <select  name="city"><option value="1">城市</option></select>    下拉框
    <input type="file" name="head"/>   选择文件
    <input type="text" name="code" /><img src="a.png"><input type="button" value="点我换一张" />  验证码
    <textarea>请输入自我描述~~</textarea>   多行文本输出区
    href="#"   跳转网页链接

图片标签
    <img src="a/2.jpg" width="200px" height="500px"/>
    src属性用来指定图片的路径                                      
    width属性用来指定图片的宽度,单位是像素px     
    height属性用来指定图片的高度,单位是像素px 
超链接标签
    <a href="http://www.baidu.com" target="_blank">点我</a>
    href属性用来指定点击时要跳转的路径                    
    target属性用来指定是否打开新窗口
返回顶部
    <a name="top">设置顶部</a>
    <a href="#top">回到顶部</a>
    href指定要回到的位置，通过#获取上面name的值

音乐功能
    <audio controls="controls"><source src="jay.mp3"</source></audio>
视频功能 不支持所有格式
    <video controls="controls" loop="loop"><source src="yibo.mp4"></source></video>
        loop="loop  无限循环

#4 设置属性

    bgcolor="pink"设置背景色 
    width="300px"表格的宽度
    border="1px"表格的边框
    cellspacing="0"单元格的间距
    bordercolor="red"边框颜色
    align="center"居中对齐
    colspan="2"合并列
    rowspan="2"合并行
    checked="checked"   默认选择  一般用于性别单选和爱好多选之类的

    placeholder="内容"     文本框中提示内容

#5 弹出框

<a href="#" onclick="alert(10);">单击弹框</a>
<a href="#" onclick="prompt();">单击输入框</a>
<a href="#" onclick="confirm();">单击确认</a>
<a href="#" ondblclick="alert(10);">双击弹框</a>
<a href="#" onmouseenter="alert(10);">鼠标划入弹框</a>
<a href="#" onmouseleave="alert(10);">鼠标划出弹框</a>

萌新zys

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
HTML基础编辑

#1常识<title> html测试 </title> <body> </body>&nbsp;可以在网页中实现空格<br />换行#2 常用标签 <h1> 1级标签 </h1> <h6> 6级标签 </h6> <ol><li...
复制链接

扫一扫