http 页面设计

来源:互联网 发布:帝国cms 编辑:程序博客网 时间:2024/04/29 02:20

<head>

<meta http-equiv="Content-Type"content="text/html; charset=utf-8" />

    metahtml中的元标签,其中包含了对应html的相关信息,客户端浏览器或服务器端的程序会根据这些信息进行处理。    HTTP-EQUIV类似于HTTP的头部协议,它回应给浏览器一些有用的信息,以帮助正确和精确地显示网页内容。    content(内容类型):重要!!这个网页的格式是文本的,网页模式    charset(编码):特别重要!!!这个网页的编码是utf-8,中文编码,需要注意的是这个是网页内容的编码,而不是文件本身的,其他类型的编码中文可能会出现乱码。

<meta name="keywords"content="软件培训"/>

       关键字——搜索引擎搜索的关键字

<meta name="description"content="软件培训"/>

     网页描述——搜索引擎文章的大体意思,可以作为搜索结果的描述内容

<title>软件</title>————网页标题

</head>

<body>
<h1>robots.txt</h1>--------------标题1
<h2><a href="#myPosiztion">页面权</a>重</h2>------------标题2
<font size="+6" color="#0066CC" face="方正舒体, 方正姚体" >连入</font>
字体设置:大小6 颜色:。。。字体为**,**如果有第一个则用第一个,没有用第二个
<b>&gt;&lt;软件培训</b>————&gt;大于号>  &lt;小于号<  <b></b>加粗
&lt;script type="text/javascript"&gt;
&nbsp;&quot;ddddrobots.txt————&nbsp;空格 &quot;双引号(英文)
<i><u>的范德</u>萨</i>——————<i></i>倾斜 <u></u>加下划线
ddd<sup>2</sup>d<sub>2</sub>&copy;——<sup></sup>上标<sup></sup>下标
 
 
分割标签    <br/>——————回车换行
<p>一种特殊的组件,他在 JMenu 上提供分隔符。JPopupMenu 与JToolBar 类也支持分隔,</p>     <p></p>——————分段
<hr size="30" width="30%" color="#FF3300" noshade="noshade"/>
————分割线 size宽度 width 长度 30%屏幕比例 noshade 没阴影
列表
<br />
(有序列表)<br />
<ol>————————有序列表
    <li>北京</li>————表内容
    <li>北京</li>
    <li>北京</li>
</ol>
<br />
(无序列表)<br />
<ul>——————————无序列表
    <li>北京</li>
    <li>北京</li>
    <li>北京</li>
</ul>
<br />
(定义列表)
<dl>————————标签定义了定义列表(definition list
    <dt>——————————定义列表中的项目
         标题部分
    <dt>
    <dd>——————————描述列表中的项目
         图片位置
    <dd>
</dl>
<br />
列表嵌套
<ul>
    <li>北京</li>
    <li>
        <ol>
            <li>北京</li>
            <li>北京</li>
            <li>北京</li>
        </ol>
    </li>
    <li>北京</li>
</ul>
 
<br />
<hr/>
<a name="myPosiztion">超链接</a><br />——锚连接
<a href="#">空连接</a>、文字超链接、锚连接、图片超链接、热区超链接、Email链接、js链接<br />
<a href="http://www.baidu.com">文字超链接</a>
<a href="http://www.baidu.com"><img src="xx.jpg" width="100" height="80" title="食品" alt="蛋炒饭图片"/></a>————图片超链接 alt表示没有图片显示alt
<img src="xx.jpg" alt="蛋炒饭图片" width="400" height="380" border="0" usemap="#Map" title="食品"/>
<map name="Map" id="Map">
  <area shape="circle" coords="81,174,60" href="http://www.baidu.com" />
  <area shape="poly" coords="199,39,183,90,164,204,199,314,341,342,380,205,345,116,250,41" href="http://www.163.com" />————热区链接
</map>
联系方式:<a href="mailto:xxx@xx.com">张经理</a>——Email链接
<a href="javascript:window.close()">关闭窗口</a>——js链接
</body>
</html>

<a href="t.html#myPosiztion">锚点测试<a>

<table border="1"bgcolor="#FFFF99" cellpadding="3" cellspacing="3"background="xx1.jpg"

————边界宽   背景颜色  单元边界与单元内容之间的间距设置 规定单元之间的空间

width="400"height="300">

       <thead>————————表格头(标题)

       <tr>

           <th>序号</th>

       <th>姓名</th>

       <th>性别</th>

       <th>年龄</th>

   </tr>

   </thead>

   <tbody>——————表格内容

   <tr>

           <td>1</td>

       <td colspan="2">2</td>——单元格向右合并多少个单元格 colspan

       <td rowspan="2">&nbsp;</td>——单元格向下合并多少个单元格 rowspan

   </tr>

   </tbody>——————表格结尾(可以没有)

   <tfoot>

    <tr>

           <td colspan="4">版权所有</td>      

   </tr>

</tfoot>

</table>

0 0
原创粉丝点击