zoukankan      html  css  js  c++  java
  • 不常用标签及其属性的用法

    • <blockquote cite="url"></blockquote>一段长引用

    • <q cite="url"></q>短引用

    • <abbr title="professor">pro</abbr>单词缩写

    • <acronym title="who are you">WAY</acronym>首字母缩写(在HTML5中,无论是单词缩写还是首字母缩写都用abbr)

    • <cite></cite>用来引用一部作品(如,书籍,电影或研究报告等)

    • <dfn></dfn>用来表示专业术语的定义

    • <del>A</del><ins>B</ins>对内容的修改,删除A添加B,即用B来替换A

    • <address>

      homer@example.org


      742 Evergreen Terrace, Springfield.

      </address>

    • <a href="mailto:772149892@qq.com">mail me</a>email链接

    • <a href="#要定位指定位置标签的ID"></a>定位到当前页面某个位置

    • <a href="url/#id名"></a>定位到其他页面指定位置,在指定页面URL后面加‘/#id’,标签的id。

    • <img src="url" alt="" title="">alt属性是对图片进行文本说明,当图片无法显示时,这段文字会显示出来title属性是对图片的附加信息,当鼠标在图片上悬停时可以看到title中的内容

    • 图片格式:图片最好保存为gpeg格式;当图片包含少量颜色或大面积同色区域时,应存为GIF或PNG格式,
      透明GIF,如果图像的透明部分有直边,并且这部分不透明(100%)存为GIF格式;如果图像的透明部分包含斜线,圆边,或者想用版透明度,或者投影,将图片存为PNG格式。

    • 图形和图形说明

      <figure>

      <img src="images/otters.jpg" alt="Photograph of two sea otters floating in water" />


      <figcaption>Sea otters hold hands when they sleep so they don't drift away from each other.</figcaption>

      </figure>

    • 表格标题<th scope="col/row">此标签中scope属性表示此标题是列标题(col)还是行标题(row)

        	<table>
        		<tr>
        			<th></th>
        			<th scope="col">Saturday</th>
        			<th scope="col">Sunday</th>
        		</tr>
        		<tr>
        			<th scope="row">Tickets sold:</th>
        			<td>120</td>
        			<td>135</td>
        		</tr>
        		<tr>
        			<th scope="row">Total sales:</th>
        			<td>$600</td>
        			<td>$675</td>
        		</tr>
        	</table>
      
    • 表格的跨行和跨列

    跨行:

    <head>
    	<title>Spanning Rows</title>
    	<style type="text/css">
    		table {
    			border: none;}
    		th, td {
    			border: none;
    			background-color: #dddddd;
    			padding: 5px;
    			 100px;}
    	</style>
    </head>
    <body>
    	<table>
    		<tr>
    			<th></th>
    			<th>ABC</th>
    			<th>BBC</th>
    			<th>CNN</th>
    		</tr>
    		<tr>
    			<th>6pm - 7pm</th>
    			<td rowspan="2">Movie</td>
    			<td>Comedy</td>
    			<td>News</td>
    		</tr>
    		<tr>
    			<th>7pm - 8pm</th>
    			<td>Sport</td>
    			<td>Current Affairs</td>
    		</tr>
    	</table>
    </body>
    
    ABC BBC CNN
    6pm - 7pm Movie Comedy News
    7pm - 8pm Sport Current Affairs

    跨列:###

    <head>
    	<title>Spanning Columns</title>
    	<style type="text/css">
    		table {
    			border: none;}
    		th, td {
    			border: none;
    			background-color: #dddddd;
    			padding: 5px;
    			 100px;}
    	</style>
    </head>
    <body>
    	<table>
    		<tr>
    			<th></th>
    			<th>9am</th>
    			<th>10am</th>
    			<th>11am</th>
    			<th>12am</th>
    		</tr>
    		<tr>
    			<th>Monday</th>
    			<td colspan="2">Geography</td>
    			<td>Math</td>
    			<td>Art</td>
    		</tr>
    		<tr>
    			<th>Tuesday</th>
    			<td colspan="3">Gym</td>
    			<td>Home Ec</td>
    		</tr>
    	</table>
    </body>
    
    9am 10am 11am 12am
    Monday Geography Math Art
    Tuesday Gym Home Ec
  • 相关阅读:
    [moka同学笔记]一、Yii2.0课程笔记(魏曦老师教程)
    [moka同学笔记]yii2.0导航栏
    [moka同学笔记]Yii2.0 dropDownList的使用(二)
    [moka同学笔记]Yii2.0验证码
    [moka同学摘录]Yii2 csv数据导出扩展
    [moka同学笔记]PHPexcel之excel导出和导入
    [moka同学代码]PHP初级知识:上传文件源码
    [moka同学摘录]在Centos 6.5下成功安装和配置了vim7.4
    [moka同学摘录]iptables防火墙规则的添加、删除、修改、保存
    [moka同学笔记]linux服务器防火墙的设置
  • 原文地址:https://www.cnblogs.com/xiaozhuzhu77/p/4157386.html
Copyright © 2011-2022 走看看