html的一些简单笔记

最新推荐文章于 2024-07-25 11:26:35 发布

家里敷泥呀

最新推荐文章于 2024-07-25 11:26:35 发布

阅读量111

点赞数

分类专栏：温故而知新——Java基础文章标签： html

本文链接：https://blog.csdn.net/Q80470101/article/details/84357535

版权

温故而知新——Java基础专栏收录该内容

2 篇文章 0 订阅

订阅专栏


	1.基本标签
	<html>
	  <head><title>标题</title>
	  </head>
	  <body>
	    <br/><!-- 换行 -->
		<hr/><!-- 水平分割符 -->
		 空格<小于>大于
	  </body>
	</html>


	2.层级缩进
	<dl>
	  <dt>一级</dt>
	  <dd>二级</dd>
	  <dd>二级</dd>
	</dl>


	3.无序列表
	无序列表
	<ul>
	  <li>AAA</li>
	  <li>BBB</li>
	</ul>


	4.有序列表
	有序列表
	<ol>
	  <li>AAA</li>
	  <li>BBB</li>
	</ol>


	5.图像
	<img src="1.jpg" alt="图片说明"/>


	6.表格
	<!-- 
	table
	  |-tbody
	    |-tr
	      |-th
	      |-td 
	-->
	<table border="1px" cellpadding="6px" cellspacing="0px">
	<!-- border="1px"框线  cellpadding="6px"单元格内边距  cellspacing="0px"单元格空间距离 -->
	  <caption>表格标题</caption>
	  <tr>
	    <th colspan="2">AAAAAAA</th>
		<!-- colspan="2" 占两列 -->
	    <td>AAAAAAA</td>
	  </tr>
	  <tr>
	    <td>AAAAAAA</td>
	    <td>AAAAAAA</td>
	    <td>AAAAAAA</td>
	  </tr>
	</table>
	<table border="1px" cellpadding="6px" cellspacing="0px">
	  <tr>
	    <th rowspan="2">AAAAAAA</th>
		<!-- rowspan="2" 占两行 -->
	    <td>AAAAAAA</td>
	  </tr>
	  <tr>
	    <td>AAAAAAA</td>
	  </tr>
	</table>


	7.超链接
	<a href="" title="连接说明">XXX</a>
	<a href="#q1" title="连接说明">XXX</a>
	<!-- href="#q1"  加#表示当前页面定位的name -->
	<a name="q1">XXXX</a>
	<!-- name="q1"  提供定位标记-锚 -->


	8.框架标签(定义在head与body之间)
	<frameset rows="20%,*">
	  <frame src="1.html" name="top" noresize="noresize">
	  <frameset cols="30%,*">
		<frame src="2.html" name="left">
		<frame src="3.html" naem="rigth">
	  </frameset>
	</frameset>
	<!-- 2.html -->
	<a href="" target="right">XXXX</a>
	<!-- target="right"  定位到显示连接资源的位置name -->


	9.iframe标签
	<iframe strc="">画中画标签</iframe>


	10.form表单
	<form>
	  用户名：<input type="text" name="user"/><br/>
	  密码：<input type="password" name="psw"/><br/>
	  性别：<input type="radio" name="sex" value="nan" checked="checked">男<input type="checkbox" name="sex" value="nv">女<br/>
	  <!-- （name属性必须有，且同类的name值相同） -->
	  技术：<input type="checkbox" name="tech" value="java">JAVA
	  <input type="checkbox" name="tech" value="html">HTML
	  <input type="checkbox" name="tech" value="css">CSS<br/>
	  <input type="file" name="file"/><br/>
	  <input type="button" name="btn" value="按钮" onclick="alert(1);"/>
	  <input type="image" src=""/><!-- （具备submit功能） -->
	  <input type="hidden" name="mykey" value="myvalue"/><br/>
	  下拉框
	  <select name="country" size="4">
    	<option value="none">--选择国家--</option>
        <option value="usa">美国</option>
        <option value="cn" selected="selected">中国</option>
        <option value="en">英国</option>
      </select>
	  <textarea></textarea>
	  <input type="submit" value="提交"/>
	  <!-- （通过name属性做key、value属性做值封装数据,所以除输入框外,表单标签都应该定义这两个标签） -->
	  <input type="reset" value="重置"/>
	</form>


	11.区域框元素-fieldset
	<fieldset style="margin: 10px; padding: 8px"> // margin设置外边框，padding设置内边框
		<legend>区域说明</legend>
		<%-- 页面元素 --%>
	</fieldset>


	12. 选择文字时勾选选框
	使用<label for="目标id">XXX</label>,例：
	<input type="checkbox" id="otherOrder"><label for="otherOrder">其他选中订单同此时间导出</label></input>

家里敷泥呀

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
html的一些简单笔记

[code="html"] 1.基本标签标题 &nbsp;空格&lt;小于&gt;大于 [/code][code="html"] 2.层级缩进一级二级二级 [/code][code="html"] 3.无序列表无序列表 AAA ...
复制链接

扫一扫

专栏目录