2018-03-21 HTML的单双标签1

晚上吃完饭回家,想着煲点汤,睡觉前吃一点,明天早上做早饭把剩下的吃完,洗了热水澡,摸了香香的身体乳,敲笔记记一下今天的总结,想着别锅里的水烧干了,起身看了一下锅,一下子脾气来了,不知道谁给我火关了,我的汤还是一锅水,不开心~~~

今天学的还是html的标签

双标签

<ol>:有序列表标签
<li>是列表项标签
属性:type="列表样式" start="列表起始值"
举例:

<html>
    <head>
<meta charset="UTF-8">
        <title>3月21日练习</title>
    </head>
    <body>
        <ol type="A" start="5">
            <li>第一项</li>
            <li>第二项</li>
            <li>第三项</li>
        </ol>
    </body>
</html>

E.第一项
F.第二项
G.第三项

<ul>:无序列表标签
<li>是列表项标签
属性:type="列表样式"
举例:

<html>
    <head>
        <meta charset="UTF-8">
        <title>3月21日练习</title>
    </head>
    <body>
        <ul type="disa">
            <li>第一项</li>
            <li>第二项</li>
            <li>第三项</li>
        </ul>
    </body>
</html>

.第一项(此处的点在中间)
.第二项
.第三项

<html>
    <head>
        <meta charset="UTF-8">
        <title>3月21日练习</title>
    </head>
    <body>
        <ul type="disc">
            <a href="www.baidu.com"><li>百度</li></a>
            <a href="www.google.com"><li>google</li></a>
            <a href="www.sogou.com"><li>搜狗</li></a>
        </ul>
    </body>
</html>

<pre>:预格式文本标签(大量文字输入推荐使用)
<a>:超链接标签
属性:href="链接路径"(也可用#锚名) name="锚名"(特殊锚#top)
举例

<html>
    <head>
            <meta charset="UTF-8">
            <title>3月21日练习</title>
    </head>
    <body>
        <a href="http://www.w3school.com.cn/">Visit W3School</a>
    </body>
</html>
<html>
    <head>
            <meta charset="UTF-8">
            <title>3月21日练习</title>
    </head>
    <body>
        <a href="https://www.baidu.com/s?rsv_idx=1&wd=%E7%BE%8E%E5%9B%BD%E7%9F%AD%E5%B0%BE%E7%8C%AB&usm=4&ie=utf-8&rsv_cq=%E7%8C%AB%E5%92%AA&rsv_dl=0_left_pet_multi_6829"><img src="timg.jpeg"></a>
    </body>
</html>

结合无序列表和<a>链接

<html>
    <head>
            <meta charset="UTF-8">
            <title>3月21日练习</title>
    </head>
    <body>
        <ul type="disc">
            <a href="www.baidu.com"><li>百度</li></a>
            <a href="www.google.com"><li>google</li></a>
            <a href="www.sogou.com"><li>搜狗</li></a>
        </ul>
    </body>
</html>

<marquee>:滚动标签
属性:scrolldelay="滚动延迟"
direction="滚动方向"(上下左右)不要写相对运行方向"
OnMouseOver="鼠标覆盖后效果" this.stop()/this.start()
OnMouseOut="鼠标移开后效果"
OnMouseOver="this.stop()" OnMouseOut="this.start()"
当鼠标放在图片上,图片暂停,鼠标移开后,图片开始滑动
举例

<html>
    <head>
            <meta charset="UTF-8">
            <title>3月21日练习</title>
    </head>
    <body>
        <marquee scrolldlay="10" direction="up" OnMouseOver="this.stop()" OnMouseOut="this.start()">
            <img src="timg.jpeg" width="350px" hight="500px" >
        </marquee>
        <marquee scrolldlay="10" direction="right" OnMouseOver="this.stop()" OnMouseOut="this.start()">
            <img src="timg.jpeg" width="350px" hight="500px" >
        </marquee>
        <marquee scrolldlay="10" direction="right" OnMouseOver="this.stop()" OnMouseOut="this.start()">
            <marquee scrolldlay="10" direction="up" OnMouseOver="this.stop()" OnMouseOut="this.start()">
            <img src="timg.jpeg" width="350px" hight="500px" >
        </marquee>

    </body>
</html>

单标签


:分割线标签
属性:color="颜色" size="粗细px" width="宽度px/百分比%"( 建议写百分比)
举例

<html>
    <head>
        <title>3月21日练习</title>
    </head>
    <body>
        <hr color="red" size="5" width="50%">
    </body>
</html>
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • HTML标签解释大全 一、HTML标记 标签:!DOCTYPE 说明:指定了 HTML 文档遵循的文档类型定义(D...
    米塔塔阅读 8,672评论 1 41
  • 一,HTML语言的一般语法: 1,围堵标记:<>… 1)带属性的标记: … 2)无属性的标记:加粗 居中 标题 2...
    清水易蓝阅读 5,046评论 0 2
  • 第1章 认识JS JavaScript能做什么?1.增强页面动态效果(如:下拉菜单、图片轮播、信息滚动等)2.实现...
    mo默22阅读 5,198评论 0 5
  • 一、JS前言 (1)认识JS 也许你已经了解HTML标记(也称为结构),知道了CSS样式(也称为表示),会使用HT...
    凛0_0阅读 7,741评论 0 8
  • 忽然要毫无理由忍受锯齿般的疼痛吞噬着,我无力躲避只能用感官来承受。明知道是个错,却要一错再错,我承认,这么多年来...
    若琼阅读 3,077评论 3 5