目录
HTML
什么是浏览器什么是服务器?
请求协议:http协议:
原来浏览器所做的事情是将服务器响应回来的response进行从上到下的解析(渲染),将最后的页面效果显示出来。
浏览器上能识别的语言
首页 web前端 html教程 在公司没事,随手写写

在公司没事,随手写写

Aug 15, 2016 pm 04:49 PM

HTML

什么是浏览器什么是服务器?

  1. 浏览器是指可以显示网页服务器或者文件系统的HTML文件(标准通用标记语言的一个应用)内容,并让用户与这些文件交互的一种软件。(前端) *特点:
    • 可以显示服务器中的html文件。
    • 可以让用户与这些文件交互。
  2. 服务器,也称伺服器,是提供计算服务的设备。由于服务器需要响应服务请求,并进行处理,因此一般来说服务器应具备承担服务并且保障服务的能力。
    • 特点:
    • 处理请求。
    • 必须保证二十四小时开机状态。

请求协议:http协议:

  1. 请求报文。
  2. 响应报文。
  3. url:(地址)地址栏上我们输入的内容。
    • Url的组成:协议://服务器的ip地址:端口号/请求页面。

原来浏览器所做的事情是将服务器响应回来的response进行从上到下的解析(渲染),将最后的页面效果显示出来。

浏览器上能识别的语言

  1. HTML:从语义角度,描述页面的结构。
  2. css:从审美的角度,美化页面。
  3. javascript:从交互的角度,提升用户的角度。

HTML

  1. 标签与标签的关系
    • 嵌套关系
    • 并列关系
  2. 标签

2.1 h(header)标签

<code><code class="hljs stylus"> h系列的标签(Header):<span class="hljs-tag">h1,<span class="hljs-tag">h2,<span class="hljs-tag">h3,<span class="hljs-tag">h4,<span class="hljs-tag">h5,<span class="hljs-tag">h6
 作用:把页面上的文字加上标题上的语义
 *注意:一个页面只能使用一个h1标签</span></span></span></span></span></span></code>
</code>
登录后复制

2.2 p(paragraph)段落标签

<code><code class="hljs undefined"> 作用:给页面的上一段文字加上段落的语义。
 特点:页面上的一个段落,单独占一行,并且与上下内容之间存在距离。</code>
</code>
登录后复制

2.3 hr标签(Horizontal Rule)

<code><code class="hljs undefined"> 作用:在页面显示一条横线(没有自己的语义)
 特点: 在页面显示一条横线,默认占整行。</code>
</code>
登录后复制

2.4 br标签(break)

<code><code class="hljs undefined"> 作用和特点都是换行</code>
</code>
登录后复制

2.5 b(Bold),u(Underlined),i(Italic),s(Strikethrough),strong,em,del,ins

<code><code class="hljs stylus"> 作用:
     b:加粗    语义:没有语义
     u: 下划线
     <span class="hljs-tag">i:  倾斜
     s: 删除线
     建议不要使用,因为这些标签没有语义。
     作用:
     <span class="hljs-tag">strong:加粗   语义:加强语气
     <span class="hljs-tag">ins:下划线
     <span class="hljs-tag">em:倾斜
     <span class="hljs-tag">del:删除线
     可以使用</span></span></span></span></span></code>
</code>
登录后复制

2.6 img标签(image):

<code><code class="hljs dos">       作用:在页面显示一张图片
       特点:就是显示图片。
        属性:
     src    图片显示的路径
     alt    如果图片加载不出来会显示这个属性中的文字
     <span class="hljs-built_in">title    介绍这张图片</span></code>
</code>
登录后复制

2.7 a标签(Anchor):锚

<code><code class="hljs livecodeserver"> <span class="hljs-operator">a 标签的其它名称:
    超级链接,超链接,锚链接
    作用:可以在一个页面跳转到另一个页面上
 注意:在<span class="hljs-operator">a标签之内必须要写上文字,如果没有,那么这个标签在页面上找不到。
 <span class="hljs-operator">a标签的其它用法:
 <span class="hljs-number">1.0可以不跳转(跳转到当前页面)href=”<span class="hljs-comment">#”
 <span class="hljs-number">2.0可以跳转到另外的页面。
 <span class="hljs-number">3.0可以在当前页面进行定位。
 A.设置<span class="hljs-operator">a标签的href属性为“<span class="hljs-comment">#id名”,
 B.在页面的指定位置加入一个目标标签(可以是任意标签)
 C.必须给这个标签设置一个id名:<p id="”mubiao”">这是目标</p>
  <span class="hljs-number">4.0在跳转的页面进行定位。
  <span class="hljs-number">5.0可以进行下载。(强烈不推荐使用)

    <span class="hljs-operator">a标签的属性:
  href    <span class="hljs-operator">a标签跳转的目标地址
  target    <span class="hljs-title">_blank:保留原始页面,再进行跳转
  <span class="hljs-title">_self:在当前页面进行跳转
  base    为页面上所有的<span class="hljs-operator">a标签设置跳转的方式(base标签一般放在titile标签下面)</span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></code></code>
登录后复制
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

AI Hentai Generator

AI Hentai Generator

免费生成ai无尽的。

热门文章

R.E.P.O.能量晶体解释及其做什么(黄色晶体)
2 周前 By 尊渡假赌尊渡假赌尊渡假赌
仓库:如何复兴队友
4 周前 By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒险:如何获得巨型种子
4 周前 By 尊渡假赌尊渡假赌尊渡假赌

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

公众号网页更新缓存难题:如何避免版本更新后旧缓存影响用户体验? 公众号网页更新缓存难题:如何避免版本更新后旧缓存影响用户体验? Mar 04, 2025 pm 12:32 PM

公众号网页更新缓存,这玩意儿,说简单也简单,说复杂也够你喝一壶的。你辛辛苦苦更新了公众号文章,结果用户打开还是老版本,这滋味,谁受得了?这篇文章,咱就来扒一扒这背后的弯弯绕绕,以及如何优雅地解决这个问题。读完之后,你就能轻松应对各种缓存难题,让你的用户始终体验到最新鲜的内容。先说点基础的。网页缓存,说白了就是浏览器或者服务器为了提高访问速度,把一些静态资源(比如图片、CSS、JS)或者页面内容存储起来。下次访问时,直接从缓存里取,不用再重新下载,速度自然快。但这玩意儿,也是个双刃剑。新版本上线,

如何使用HTML5表单验证属性来验证用户输入? 如何使用HTML5表单验证属性来验证用户输入? Mar 17, 2025 pm 12:27 PM

本文讨论了使用HTML5表单验证属性,例如必需的,图案,最小,最大和长度限制,以直接在浏览器中验证用户输入。

HTML5中跨浏览器兼容性的最佳实践是什么? HTML5中跨浏览器兼容性的最佳实践是什么? Mar 17, 2025 pm 12:20 PM

文章讨论了确保HTML5跨浏览器兼容性的最佳实践,重点是特征检测,进行性增强和测试方法。

如何高效地在网页中为PNG图片添加描边效果? 如何高效地在网页中为PNG图片添加描边效果? Mar 04, 2025 pm 02:39 PM

本文展示了使用CSS为网页中添加有效的PNG边框。 它认为,与JavaScript或库相比,CSS提供了出色的性能,详细介绍了如何调整边界宽度,样式和颜色以获得微妙或突出的效果

&lt; datalist&gt;的目的是什么。 元素? &lt; datalist&gt;的目的是什么。 元素? Mar 21, 2025 pm 12:33 PM

本文讨论了html&lt; datalist&gt;元素,通过提供自动完整建议,改善用户体验并减少错误来增强表格。Character计数:159

&gt; gt;的目的是什么 元素? &gt; gt;的目的是什么 元素? Mar 21, 2025 pm 12:34 PM

本文讨论了HTML&lt; Progress&gt;元素,其目的,样式和与&lt; meter&gt;元素。主要重点是使用&lt; progress&gt;为了完成任务和LT;仪表&gt;对于stati

我如何使用html5&lt; time&gt; 元素以语义表示日期和时间? 我如何使用html5&lt; time&gt; 元素以语义表示日期和时间? Mar 12, 2025 pm 04:05 PM

本文解释了HTML5&lt; time&gt;语义日期/时间表示的元素。 它强调了DateTime属性对机器可读性(ISO 8601格式)的重要性,并在人类可读文本旁边,增强Accessibilit

&lt; meter&gt;的目的是什么。 元素? &lt; meter&gt;的目的是什么。 元素? Mar 21, 2025 pm 12:35 PM

本文讨论了HTML&lt; meter&gt;元素,用于在一个范围内显示标量或分数值及其在Web开发中的常见应用。它区分了&lt; meter&gt;从&lt; progress&gt;和前

See all articles