zoukankan      html  css  js  c++  java
  • HTML:基本的标签

    概述:

    <html></html>标准的语言格式,回环标签,有头和躯体部分,头里面一般显示标题title,躯体部分显示内容:背景色、文字、图片、超链接、表格、表单等。

    可以直接去官方文档去查看:http://www.w3school.com.cn/jsref/jsref_events.asp

    标题:<title></title>

    超链接:<a href=""></a>

    段落:<p></p>

    换行:<br/>

    分割线:<hr>

    引用:<blockquote cite> </blockquote>

    代码:<pre></pre>

    表格:<table></table>

         行:<tr></tr>

         格:<td></td>

    图片:<img  src ="" />

    表单:<form></form>

    扩展:

    html看似复杂,其实常用的标签并不多,这里总共介绍一些html的常用标签
    文字处理:
    ①标题:<h1> to <h6>
    ②段落:<p>文字段落</p >
    ③加粗:<b>单纯的文字加粗效果</b>
    ④<strong>:把文本定义为语气更强的强调的内容,文字也会加粗</strong>
    ⑤<span>定义文档中的节</span>
    ⑥<em>强调文字,文字会出现斜体</em>
      <i>单纯的文字斜体效果</i>
    ⑦<font>字体大小,颜色等</font>
    列表
    ①无序列表:<ul><li>列表</li></ul>
    ②有序列表:<ol><li>列表</li></ol>
    ③用来创建一个普通的列表:
    < dl>
    < dt>用来创建列表中的上层项目< /dt>
    < dd>用来创建列表中最下层项目< /dd>
    < /dl>
    图片
    ①插入图片:< img src="图片路径" />
    布局
    ①层
    <div></div>
    ②表格(1行2列演示)
    <table width="100%" border="0" cellspacing="0" cellpadding="0"> 
      <tr> 
        <td> </td> 
        <td> </td> 
      </tr> 
    </table>
    表单:
    <form>
      <input type="text" name="fname" /> <!--文本域-->
      <input type="password" name="password">  <!--密码-->
      <input type="submit" value="Submit" />  <!--提交按钮—>
      <input type="checkbox" name="Car"><!--复选—>
      <textarea cols="30" rows="5">文本域</textarea> <!--文本域—>
      <select name="cars">  <!--下拉列表—> 
        <option value="volvo">Volvo</option> 
        <option value="saab">Saab</option> 
        <option value="fiat">Fiat</option> 
        <option value="audi">Audi</option> 
      </select>
    </form> 
     
    练习:
    <!doctype html>
    <html>
        <head>
            <title> 我是html语言 </title>        
        </head>
    
    <body bgcolor="#FF7EFF">  
        <strong><em>我的第一个网页!</em></strong>
        <hr>
        <br/>
        <a href="http://my.51job.com/careerpost/marketing/sem/sogou_v1.html?from=sogouad"> 58招聘 </a>
        <p> 
          我喜欢PHP!我喜欢PHP!我喜欢PHP!我喜欢PHP!我喜欢PHP!我喜欢PHP!我喜欢PHP!
          我喜欢PHP!我喜欢PHP!我喜欢PHP!我喜欢PHP!我喜欢PHP!我喜欢PHP!我喜欢PHP!我喜欢PHP!我喜欢PHP!
          我喜欢PHP!我喜欢PHP!我喜欢PHP!我喜欢PHP!我喜欢PHP!
        </p>
        
        <hr>
        <p> 
          <i>我是iOS工程师! 我是iOS工程师! 我是iOS工程师! 我是iOS工程师! 我是iOS工程师! 我是iOS工程师! 我是iOS工程师!
          我是iOS工程师! 我是iOS工程师! 我是iOS工程师! 我是iOS工程师! 我是iOS工程师! 我是iOS工程师! 我是iOS工程师!
          我是iOS工程师!</i>
        </p>
        <br/>
        <img src="http://i.mmcdn.cn/simba/img/TB1KElTLpXXXXXHXVXXSutbFXXX.jpg" />
        
        <blockquote cite="http://www.baidu.com">
            <p>授人以鱼,不如授人以渔</p>
        </blockquote>
        
        <table>
           <tr><td> 第一个单元格</td> <td> 第二个单元格</td></tr>
           <tr><td> 第三个单元格</td> <td> 第四个单元格</td></tr>
        </table>
        
        <form>
            <input type="text" name="bd1"/>
            <input type="submit" name="bd2"/>
        </form>
    </body>
    </html>

     截图:

  • 相关阅读:
    常见apache问题
    机器学习——SVM讲解
    剑指offer——05用两个栈实现队列(Python3)
    剑指offer——04重建二叉树(Python3)
    剑指offer——03从尾至头打印列表(Python3)
    剑指offer——02替换空格(Python3)
    剑指offer——01二维数组中的查找(Python3)
    剑指offer——06旋转数组的最小数字(Python3)
    一个Python项目的创建架构
    python中各项目文件含义(新手可看)
  • 原文地址:https://www.cnblogs.com/XYQ-208910/p/5780430.html
Copyright © 2011-2022 走看看