html的理解三

最新推荐文章于 2024-06-04 08:13:24 发布

SPIRT00

最新推荐文章于 2024-06-04 08:13:24 发布

阅读量99

点赞数

分类专栏：前端基础学习文章标签： html javascript 前端

本文链接：https://blog.csdn.net/weixin_51884452/article/details/128139319

版权

前端基础学习专栏收录该内容

16 篇文章 1 订阅

订阅专栏

文章目录

一、html
总结

一、html

1.html框架

//通过使用框架，在浏览器窗口上显示不止一个页面。可设置height,width。
iframe语法：

<iframe src ="url"></iframe>

1.frameborder用来是否显示边框。设置0不显示。

<iframe src="demo_iframe.htm" width="200" height="200" frameborder="0">
 <p>您的浏览器不支持  iframe 标签。</p>
</iframe>

2.使用iframe来显示目标链接页面


    <iframe src="demo_iframe.htm" name="iframe_a"></iframe>
    <p><a href="https://www.baidu.com" target="iframe_a">RUNOOB.COM</a></p>

    <p><b>注意：</b> 因为 a 标签的 target 属性是名为 iframe_a 的 iframe 框架，所以在点击链接时页面会显示在 iframe框架中。</p>

//也可直接定义一个内联标签，直接在框架中显示。

2.html的颜色

//html颜色由红蓝绿混合而成。可通过颜色表进行细致查询。

<p style="background-color:#FFFF00">
通过十六进制设置背景颜色
</p>

3.html脚本

//js和html将会有更强的交互性。
1.如将脚本插入html文档中

<body>

    <script>
        document.write("Hello World!")
    </script>

</body>

2.应对不支持脚本或禁用脚本的浏览器

<body>

    <script>
        document.write("Hello World!")
    </script>
    <noscript>抱歉，你的浏览器不支持 JavaScript!</noscript>

    <p>不支持 JavaScript 的浏览器会使用 &lt;noscript&gt; 元素中定义的内容（文本）来替代。</p>

</body>

3.script标签
script标签定义客户端脚本，也可通过src属性指向外部脚本文件
js可以直接在html输出

<script>
document.write("<h1>这是一个标题</h1>");
document.write("<p>这是一个段落。</p>");
</script>

4.js事件响应

<body>

    <h1>我的第一个 JavaScript </h1>

    <p id="demo">
        JavaScript 可以触发事件，就像按钮点击。</p>

    <script>
        function myFunction() {
            document.getElementById("demo").innerHTML = "Hello JavaScript!";
        }
    </script>

    <button type="button" onclick="myFunction()">点我</button>

</body>

5.js处理html样式

<body>

    <h1>我的第一段 JavaScript</h1>
    <p id="demo">
        JavaScript 能改变 HTML 元素的样式。
    </p>
    <script>
        function myFunction() {
            x = document.getElementById("demo") // 找到元素
            x.style.color = "#ff0000"; // 改变样式
        }
    </script>
    <button type="button" onclick="myFunction()">点击这里</button>

</body>

4.字符实体

1.html中的预留字符必须被替换为字符实体。
一些键盘上找不到的字符也可以使用字符实体来替换。
2.html实体
html中某些字符是预留的，如不能使用大于和小于号会被误认为标签。想要正确的显示需要用字符实体，如&lt(小于号)
3.不间断空格
不间断空格的实体&nbsp,如果你在浏览器写入十个空格浏览器会默认删除九个。所以增加空格可用&nbsp
4.结合音标符
发音符号是结合在音标上的。如à可用à
5.html实体常见
在这里插入图片描述注意：字符实体对大小写敏感。

5.HTML url

//URL:uniform resource locators统一资源定位符。
1.url-统一资源定位符

scheme://host.domain:port/path/filename
如：http://www.baidu.com/html/html-tutorial.html语法
说明：
scheme-定义因特网的类型,常见是http
host-定义主机（http的默认主机是www）
domain-定义因特网域名如baidu.com
:port-定义主机端口号http默认80
path-定义服务器上的路径（省略文件必须位于网站的根目录）
filename-定义文档资源的名称

2.常见的url scheme