鱼C论坛

 找回密码
 立即注册
查看: 5061|回复: 19

[庖丁解牛] 0 0 1 7 - 文本与超链接

[复制链接]
发表于 2017-1-12 12:08:43 | 显示全部楼层 |阅读模式
购买主题 已有 33 人购买  本主题需向作者支付 2 鱼币 才能浏览

本帖被以下淘专辑推荐:

想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复

使用道具 举报

发表于 2017-4-20 09:23:10 | 显示全部楼层
交作业
<!DOCTYPE html>
<html lang="en">
<head>
        <meta charset="UTF-8">
        <title>链接属性和字体样式类别</title>
        <link href="0009CSS.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="container">
        <h1>我爱鱼C</h1>
        <p>让编程改变世界!<br/>Change the world by program!</p>
        <a href="http://www.fishc.com/" style="color: blue; text-decoration: none">鱼C传送门</a>
        <a href="http://bbs.fishc.com/forum.php?mod=collection&action=view&ctid=539" style="color: blue;text-decoration: none">HTML5-庖丁解牛</a>
        <a href="http://bbs.fishc.com/home.php?mod=space&uid=426569&do=index" style="color: blue;text-decoration: none">传送门</a>
        <a href="http://bbs.fishc.com/forum.php?mod=collection&action=view&ctid=595" target="_blank">
                <!--target:规定在何处打开链接文档。-->
                <section>
                        <h3>JS-庖丁解牛</h3>
                        <p>哇塞,好好玩儿,谁来谁知道</p>
                </section>
        </a>

        <p>三原色,<span style="color:red">红</span>
                <span style="color:blue">蓝</span>
                <span style="color: green">绿</span>
        </p>
        <p><em>欢迎</em>
                <small>来到</small>
                <br><strong><q>小天才养殖场</q></strong>
        </p>
        <!--em,斜体,语义加强
                strong,粗体,突出重要性。
                big,放大字体
                small,缩小字体-->
</div>
</body>
</html>
0013.png

点评

我很赞同!: 5.0
我很赞同!: 5
  发表于 2017-4-20 09:54
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2017-1-26 14:56:41 | 显示全部楼层
本帖最后由 type_J 于 2017-1-26 15:05 编辑

这个span元素的应用,我有一个疑问。如果CSS中对p做了样式处理,color:black;  那在语句中的span会是什么效果?我回去试试了。~~

经过确认,是按span内样式执行的。
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

 楼主| 发表于 2017-1-26 16:50:23 | 显示全部楼层
type_J 发表于 2017-1-26 14:56
这个span元素的应用,我有一个疑问。如果CSS中对p做了样式处理,color:black;  那在语句中的span会是什么效 ...

你说的这个是选择器的优先级

通用选择器*{..} < 标签选择器 h1{...} < 类选择器.black{...} < 伪类选择器a:hover{...} < ID选择器#title{...}
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2017-1-26 20:00:01 | 显示全部楼层
不二如是 发表于 2017-1-26 16:50
你说的这个是选择器的优先级

通用选择器*{..} < 标签选择器 h1{...} < 类选择器.black{...} < 伪类选 ...

学习了
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2017-3-27 18:31:45 | 显示全部楼层
不二如是 发表于 2017-1-26 16:50
你说的这个是选择器的优先级

通用选择器*{..} < 标签选择器 h1{...} < 类选择器.black{...} < 伪类选 ...

这应该不是选择器问题吧,两个都是同级别的标签。
这应该是"样式取决于最接近的标签的样式"吧。
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2017-6-26 14:35:53 | 显示全部楼层
一档起步。
<!doctype html>
<html >
<head>
                <meta  charset="utf-8">
                <title>文本和超链接</title>
                
</head>
<body>
        <div  id="a">
          <h1>超链接样式</h1>
          </hr />
          <p>超链接样式修炼大法</p>
          <a href="http://www.baidu.com/" target="_blank">
                        <section>
                                        <h1>百度传送门</h1>
                                        <p>纵里寻她千百度,蓦然回首,她还在那个犄角旮旯里</p>
                        </section>
          </a>
          <p>三原色,<span style="color:red">红</span>
            <span style="color:blue">蓝</span>
                <span style="color:green">绿</span>
          </p>
          <p><em>欢迎</em><small>来到</small><br>
          <strong><big>老司机部落联盟</big></strong><br>
          <cite><big><q>fishman</q></big></cite>
          </p>
        </div>
</body>
</html>

点评

我很赞同!: 5.0
我很赞同!: 5
老司机潜力  发表于 2017-6-26 18:20

评分

参与人数 1鱼币 +6 收起 理由
不二如是 + 6 热爱鱼C^_^

查看全部评分

想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2017-7-9 10:29:57 | 显示全部楼层
本帖最后由 MSK 于 2017-7-9 10:40 编辑

交!作!业!

<!doctype html>
<html>
    <head>
        <title>文本与超链接</title>
        <meta charset='utf-8'>
    </head>
    <body>
        <h1>
            <span style='font-size:30px'>
            <strong>煎蛋最新资讯</strong>
            </span>
        <h1>
        <hr />
        <section style='font-size:15px'>
            <nav>
                <ol type=1>
                    <li>
                        <article>
                            <a href='http://jandan.net/2017/07/09/injecting-human-blood.html' target='_blank'>
                                <h3>瘾君子们注射人血以获得快感</h3>
                            </a>
                            <p><em><small>镜子大王 · 健康</small></em></p>
                            <p><q><big>使用者可能认为以这种方式注射药物会产生更为强烈的感觉,或者这个人是想从血液中获得快感。</big></q></p>
                            <figure>
                                <img src='http://pic.yupoo.com/jdvip/BQSJzdk5/custom.jpg' alt='图片'>
                            </figure>
                        </article>
                    </li>
                    <li>
                        <article>
                            <a href='http://jandan.net/2017/07/09/fml-1046.html' target='_blank'>
                                <h3>发霉啦小视频:神出鬼没的球</h3>
                            </a>
                            <p><em><small>Mike · 发霉啦</small></em></p>
                            <p><q><big>发霉啦小视频4发~</big></q></p>
                            <figure>
                                <img src='http://tankr.net/s/custom/DUW3.png' alt='图片'>
                            </figure>
                        </article>
                    </li> 
                    <li>
                        <article>
                            <a href='http://jandan.net/2017/07/09/dog-4-2.html' target='_blank'>
                                <h3>半夜背后凉飕飕:高高狗-4</h3>
                            </a>
                            <p><em><small>喵熊汪太狼 · 故事</small></em></p>
                            <p><q><big>高高狗来了,大家不用敲碗了!!</big></q></p>
                            <figure>
                                <img src='http://tankr.net/s/custom/FQMV.jpg' alt='图片'>
                            </figure>
                        </article>
                    </li>     
                </ol>
            </nav>
        </section>
    </body>
</html>
turtle_看图王.png
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2017-7-14 00:10:16 | 显示全部楼层
今天继续来学习,目标是学到020!
017讲,交作业!!!
017.jpg
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2018-3-11 15:05:38 | 显示全部楼层
继续学习
<!DOCTYPE html>
<html>
<head>
                <meta charset='utf-8'>
                <title>文本与超链接</title>
</head>
        <body>
                <div id="a">
                        <h1>
                                <span style='font-size:50px'>
                                <span style="color:yellow">Dota2</span>
                                <span style="color:black">直播</span>
                        <h1>
                        <hr />
                        <section style='font-size:30px'>
                                <nav>
                                        <ol type=1>
                                                <li>
                                                        <article>
                                                                <a  target='_blank'>
                                                                        <h3>Dota2在线直播</h3>
                                                                </a>
                                                                <p><em><small>Dota2星计划</small></em></p>
                                                                <p><em><small>妹纸主播</small></em></p>
                                                                <p><em><small>中单solo</small></em></p>
                                                                <p><em><small>后期carry</small></em></p>
                                                                <p><q><big>zsmj直播间,快乐dota</big></q></p>
                                                        </article>
                                                </li>
                                        </ol>
                                </nav>
                        </section>
                </div>
        </body>
</html>
360截图20180311150522067.jpg

点评

我很赞同!: 5.0
我很赞同!: 5
  发表于 2018-3-11 15:40

评分

参与人数 1鱼币 +5 收起 理由
不二如是 + 5 热爱鱼C^_^

查看全部评分

想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2018-4-30 13:08:48 | 显示全部楼层
  这兄弟完成的实例效果,我可以用一个h标签和几个p标签完成,不需要和他用那么多不同类的标签,这样会不会更好一点呢
***********************************************************************************
                           </article>
                                                </li>
                                        </ol>
                                </nav>
                        </section>
                </div>
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2018-7-13 23:01:11 | 显示全部楼层
交作业啦!
<!DOCTYPE HTML>
<head>
    <meta charset='utf-8'>
    <title>0017 文本格式和超链接</title>
</head>
<body>
    <a href="http://www.baidu.com">普通度娘</a><br><br>
    
    <a href="http://www.baidu.com" target="_blank">新窗口度娘</a><br><br>
    
    <a href="http://www.baidu.com" target="_blank">
        <img src="https://www.baidu.com/img/bd_logo1.png">
        <h1 >百 <span style="color:black">熊掌</span> 度</h1>
        <p><em>带图 </em><small>配有</small><strong>文字小弟</strong>的<big>度娘</big></p>
    </a><br><br>
    
</body></html>

0017.JPG
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2018-10-14 23:19:38 | 显示全部楼层
<html>

<head></head>

<body>
    <a href="http://bbs.fishc.com/forum-337-1.html" target="_blank">
        <section>
            <h1>小天才养殖场</h1>
            <p>哇塞,好好玩儿,谁来谁知道</p>
        </section>
        传送门</a>
    <p>三原色,<span style="color:red">红</span>
        <span style="color:blue">蓝</span>
        <span style="color:green">绿</span>
    </p>
    <p><em>欢迎</em><small>来到</small><br><strong><big>小天才养殖场</big></strong></p>
    <p><em>欢迎</em><cite>来到</cite><br><strong><big>小天才养殖场</big></strong></p>
</body>

</html>
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2018-11-14 17:19:59 | 显示全部楼层
交作业
<!DOCTYPE html>
<html>
<head>
        <meta charset="utf-8">
        <title>0017练习</title>
</head>
<body>
        <a  target="_blank">传送门</a>
        <a  target="_blank">
                <section>
                        <h1>小天才养殖场</h1>
                        <p>精彩多多,快来围观!</p>
                </section>
        </a>
        <p>三原色,<span style="color: red">红</span>
                <span style="color: yellow">黄</span>
                <span style="color: blue">蓝</span></p>
        <p><em>欢迎</em> <small>来到</small><br><big><strong>小天才</strong>养殖场</big></p>
        <p><em>欢迎</em> <cite>来到</cite><br><big><q><strong>小天才</strong>养殖场</q></big></p>
</body>
</html>
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2019-3-29 12:33:28 | 显示全部楼层
<!DOCTYPE html>
<html>
<head>
        <meta charset="utf-8"> 
        <title>欢迎来到HTML世界</title>
        <link href="0001.css" rel="stylesheet"><!--获取的文件是style样式表-->
</head>
<body>
        <div id="container"><!--div封装,id区块说明-->
        <h1>我爱鱼C</h1> 
                <p>WWW.FishC.com - 让编程改变世界</p>
        <p>三原色,
                <span style="color:red">红</span><!--设置局部样式-->
                <span style="color: blue">蓝</span>
                <span style="color: green">绿</span>
        </p>
        <p>
                <em>        斜体</em>
                <br>
                <strong>粗体</strong>
                <br>
                <big>放大字体</big>
                <br>
                <small>缩小字体</small>
                <br>
                <cite>不强烈的斜体</cite><em>斜体对比</em>
                <br>
                <q>双引号</q>
        </p>
        <a  id="first_Js" target="_blank">传送门
                </a>
        </div>
        
        <!--<script type="text/javascript"> 直接写在body
                var first_Js = document.getElementById('first_Js');
                /*alert(first_Js);测试*/
                first_Js.onclick = function(e)
                        {
                                e.preventDefault();
                                first_Js.innerHTML = "穿越成功";
                        }
        </script>
        -->
        <script src ="0001js.js"></script>

</body>
</html>
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2019-10-26 15:14:48 | 显示全部楼层
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>让编程改变世界</title>
</head>
<body>
    <a href="http://bbs.fishc.com/forum-337-1.html" target="_blank">传送门</a>
    <a href="http://bbs.fishc.com/forum-337-1.html" target="_blank">
        <section>
                <h1>给这段文字添加了超链接</h1>
                <p>谁都可以有超链接,就是超链接不能给超链接加超链接。。。真绕口</p>
        </section>
    </a>
    </a>
    <span>为了给文字加样式,那就使用span标签</span>
    <p>三原色,
    <span style="color:red" >红</span>
    <span style="color:blue">蓝</span>
    <span style="color: green">绿</span>
    </p>
    <em>"em" 斜体,语义加强</em>
    <strong>"strong" 粗体,突出重要性</strong>
    <big>"big" 标签放大字体</big>
    <small>"small" 缩小字体</small>
    <cite>cite 轻微的斜体字 </cite>
    <q>q元素 添加双引号</q>
    <script>

    </script>
</body>
</html>
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2020-8-16 21:15:37 | 显示全部楼层
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <base href="http://xxx.fishc.com/forum/201612/05/">
        <base target="_blank">
        <title>RGB</title>
    </head>

    <body>
        <a href="http://bbs.fishc.com/forum-337-1.html" target="_blank">
            <section>
                <h1>小天才养殖场</h1>
                <p>哇塞,好好玩儿,谁来谁知道</p>
            </section>
        </a>
        <p>三原色:
            <span style="color: red">红</span>
            <span style="color: green">绿</span>
            <span style="color: blue">蓝</span>
        </p>
    </body>
</html>
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

小黑屋|手机版|Archiver|鱼C工作室 ( 粤ICP备18085999号-1 | 粤公网安备 44051102000585号)

GMT+8, 2024-12-23 05:02

Powered by Discuz! X3.4

© 2001-2023 Discuz! Team.

快速回复 返回顶部 返回列表