标签归档:html技巧

html标签 textarea多行文本框中如何显示提示信息呢?


摘要:
下文讲述html元素textarea多行文本框中显示提示信息的方法分享,如下所示:


实现思路:
使用html元素的placeholder属性为元素设置“提示值”

例:

  <!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8"> 
  <meta name="Author" content="http://www.maomao365.com"> 
  <title>猫猫教程(www.maomao365.com)
  ---为textarea设置提示内容的方法分享
  </title>
 </head>
 <body>
  <textarea  style="width:80%;margin-left:5%;margin-top:3%;resize:none;"
       rows="6"
        placeholder="这里可以放入textarea提示内容"></textarea>
 </body>
</html>
html标签textarea提示信息设置方法分享

html标签textarea提示信息设置方法分享

html label标签–你必须知道的哪些事?


摘要:
下文讲述html中label标签的功能及举例说明


label标签的功能及用法

label标签常用于包裹一段文字信息,供html输出。

其实label标签还有独到的用处(大家必须注意)

1.label标签结合input标签一起使用,可以做到,点击label标签使光标聚集在input标签上
2.label标签结合checkbox标签一起使用,可使点击label标签达到选中checkbox标签的效果

label标签的举例说明

   <!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8"> 
  <meta name="Author" content="http://www.maomao365.com"> 
  <title>猫猫教程(www.maomao365.com)
  ---label标签应用举例说明
  </title>
  <style>
   .labTest:hover{
      background-color:blue;
	  color:white;
   }
  </style>
 </head>
 <body>
    <label for="txtTest" class="labTest">
     此label标签服务于input
	</label>
	<input type="text" id="txtTest"  />
 
     <br />
     <label for="chkTest" class="labTest">
     此label标签服务于checkBox
	</label>
	<input type="checkBox" id="chkTest"  />
 

    
 </body>
</html>
html lable标签举例说明

html lable标签举例说明

如何让table中一个单元格占三行两列呢?


摘要:
下文讲述html代码中table合并单元格的技巧,如下所示;


实现思路:
1.合并列需使用属性colspan
2.合并行需要使用属性rowspan

例:
对一个5行5列的table的第一个单元格进行 “三行两列”的合并操作

<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8"> 
  <meta name="Author" content="http://www.maomao365.com"> 
  <title>猫猫教程(www.maomao365.com)
  --对table单元格执行合并操作
  </title>
  <style>
    td{
	 width:60px;
	 height:30px;
	}
  </style>
 </head>
 <body>
     <p>
	 www.maomao365.com 关于table合并单元格的演示:
</p>
   <table border="1">
<tr>
	<td colspan=2 rowspan=3 style="background-color:black"></td>
	<td></td>
	<td></td>
	<td></td> 
</tr>
<tr> 
	<td></td>
	<td></td>
	<td></td>
</tr>
<tr> 
	<td></td>
	<td></td>
	<td></td>
</tr>
<tr>
	<td></td>
	<td></td>
	<td></td>
	<td></td>
	<td></td>
</tr>
<tr>
	<td></td>
	<td></td>
	<td></td>
	<td></td>
	<td></td>
</tr>
</table>

 </body>
</html>
html table合并单元格的操作举例分享

html table合并单元格的操作举例分享