html前端代码的初步实现（一）

最新推荐文章于 2024-06-25 02:57:28 发布
最新推荐文章于 2024-06-25 02:57:28 发布
阅读量276 收藏
点赞数
分类专栏： HTML 文章标签： 前端 html css
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_51551156/article/details/120921835
版权

文章目录

一、页面内容

标题 hello world
我是宋体
我是隶书
我是加粗样式 我是斜体样式 我是下划线样式
我是加粗斜体下划线样式

我是第一段

我是第二段

111111

222222

333333

444444
555555
666666

下面是列表

  • 列表1
  • 列表2
  • 列表3
  • 列表4
  1. 有序列表1
  2. 有序列表2
  3. 有序列表3
  4. 有序列表4
  5. 有序列表5
  6. 有序列表6

点此前往度娘
点此前往贴吧
move!
死循环

二、知识点

1.语句

1.html的基本样式

<html>
  <head>
  	<title>标题</title>
  </head>
  <body>
  </body>
</html>

2.换行及下划线

<br>//换行
<hr>//下划线

3.字体样式

<font></font>//对字体的设置
<font color=" red（字体颜色）" size="6（字体大小）" face="隶书（字体格式）"></font>

我是隶书

  <b>
    我是加粗样式
  </b>
  <i>
    我是斜体样式
  </i>
  <u>
    我是下划线样式
  </u>
  <p>
  我是段落
  </p>
  <p align=center>//align是对齐方式
  </p>
我是加粗样式 我是斜体样式 我是下划线样式
我是加粗斜体下划线样式

我是段落

4.标题

<h1~6>//标题
<h1>111111</h1>
<h2>222222</h2>
<h3>333333</h3>
<h4 >444444</h4>
<h5>555555</h5>
<h6>666666</h6>

111111

222222

333333

444444
555555
666666

5.无序列表及有序列表

<ul>//无序列表
<ol>//有序列表
<li>//列表元素

type有：disc（默认实心圆）square（实心矩形）circle（空心圆）

<font color="red">
<h3>下面是列表</h3>
<ul type="square" style="color: rgb(75, 139, 192);">
    <li>列表1</li>
    <li>列表2</li>
</ul>
<font face="宋体">
    <ul type="circle" style="font-size: xx-large">
    <li>列表3</li>
    <li>列表4</li>
</ul>
</font>
</font>
<ol type="i" start="2">
    <li>有序列表1</li>
    <li>有序列表2</li>
    <li>有序列表3</li>
    <li>有序列表4</li>
    <li>有序列表5</li>
    <li>有序列表6</li>
</ol>
<br>

下面是列表

  • 列表1
  • 列表2
  • 列表3
  • 列表4
  1. 有序列表1
  2. 有序列表2
  3. 有序列表3
  4. 有序列表4
  5. 有序列表5
  6. 有序列表6

6.网址和函数的引用

<a href="http://www.baidu.com" target="_blank">
点此前往度娘
</a>
<hr>

<a href="https://tieba.baidu.com" target="_blank">
  <font color="blue">
    点此前往贴吧
  </font>
</a>

<br>
<a href="javascript:alert('get out away!!!')">
  move!
</a>
<hr>
<a href="javascript:test()">
  死循环
</a>

函数的定义放于/body>后</html前

</body>
<script>
  function test(){
    alert('无情铁手！！！')
    alert('致残打击！！！')
    alert('大杀四方！！！')
    while(true){  
    alert('西内！！！')
    }
  }
</script>
</html>

2.代码实现

代码如下（示例）：

<html>
  <head>
    <title>标题</title>
  </head>
  <body>
  hello world
  <br>
  <font color="purple" size="5" face="宋体">
    我是宋体
  </font>
  <br>
  <font color=" red" size="6" face="隶书">
    我是隶书
  </font>
  <br>
  <b>
    我是加粗样式
  </b>
  <i>
    我是斜体样式
  </i>
  <u>
    我是下划线样式
  </u>
<br>
<font color="purple" size="7" face="方正舒体">
<b><i><u>我是加粗斜体下划线样式</b></i></u>
</font>
<p align="left" >我是第一段</p>
<p align="center">我是第二段</p>
<h1>111111</h1>
<h2>222222</h2>
<h3>333333</h3>
<h4 align="right">444444</h4>
<h5>555555</h5>
<h6>666666</h6>
<hr>
<font color="red">
<h3>下面是列表</h3>
<ul type="square" style="color: rgb(75, 139, 192);">
    <li>列表1</li>
    <li>列表2</li>
</ul>
<font face="宋体">
    <ul type="circle" style="font-size: xx-large">
    <li>列表3</li>
    <li>列表4</li>
</ul>
</font>
</font>
<ol type="i" start="2">
    <li>有序列表1</li>
    <li>有序列表2</li>
    <li>有序列表3</li>
    <li>有序列表4</li>
    <li>有序列表5</li>
    <li>有序列表6</li>
</ol>
<br>
<a href="http://www.baidu.com" target="_blank">
点此前往度娘
</a>
<hr>

<a href="https://tieba.baidu.com" target="_blank">
  <font color="blue">
    点此前往贴吧
  </font>
</a>

<br>
<a href="javascript:alert('get out away!!!')">
  move!
</a>
<hr>
<a href="javascript:test()">
  死循环
</a>
</body>
<script>
  function test(){
    alert('无情铁手！！！')
    alert('致残打击！！！')
    alert('大杀四方！！！')
    while(true){  
    alert('西内！！！')
    }
  }
</script>
</html>
夜雨听枫氵
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
前端之HTML
zhanghangqian的博客
05-02 512
目录 1.编写一个HTML代码 2.HTML常见语法 2.1注释标签 ​2.2标题标签 2.3段落标签 2.4换行标签 2.5格式化标签 2.6图片标签 2.6.1img标签的其他属性 2.7超链接标签 2.7.1空连接 2.8列表标签 2.9表单标签 2.10 slect标签 2.11 textarea标签 2.12 无语义标签 3.案例展示 案例2： 1.编写一个HTML代码 2.HTML常见语法 2.1注释标签 2.2标题标签 ...
Web前端：HTML最强总结 附详细代码
bsegebr的博客
03-06 1275
Web前端基础： Web前端：HTML最强总结 附详细代码 Web前端：CSS最强总结 附详细代码 Web前端：JavaScript最强总结 附详细代码 Web前端工具： Web前端： JQuery最强总结（附上详细代码） Web前端：Bootstrap最强总结 附详细代码 HTML最强总结 附详细代码 常见工具下载 基本结构 常用标签 文本标签 段落标签 换行标签 水平线标签 范围标签 图片标签 列表标签 定义描述标签 标签分类 超链接 页面间的跳转 锚链接 表格标签 规
前端网页HTML
12-08
前端网页开发代码，包含HTML和css等脚本语言。
前端基础（HTML）——html介绍 &amp； 常用标签 &amp； 几个案例_html基础标签及示例
2401_85599481的博客
06-25 321
h1标题，独占一行，加粗，段前段后间距。
web前端html代码,WEB前端--HTML(示例代码)
weixin_34335039的博客
06-10 4751
HTML基础一、基本概念1、简介HTML：网页超文本标记语言，不是编程语言，是描述性的标记语言。2、基本结构3、标记：html开头，表示网页文档的开始二、编写方法文档工具，如：记事本IDE三、浏览html文件1、运行效果如果用pycharm编写，不要直接运行，直接找到文件路径打开这个文件最快捷。因为pycharm直接运行是作为一个服务监听起来，比较慢。2、看源文件鼠标右键-->查看源文件HT...
HTML前端代码分析(暗链)
cc_de_csdn的博客
08-25 567
1.由题意得知需要在页面源码中发现解题信息 2.使用火狐的F12功能查看源码，在源码中发现了一个含有内网的不明文件链接 3.尝试将链接中的文件直接添加到网站的url中 4.发现得到KEY ...
1.前端日记第一天，html和css代码 简历.zip
04-20
在“前端日记第一天，html和css代码 简历.zip”中，我们可以推测作者在学习如何使用这些标签来构建一个简历页面。例如，`<h1>`通常用于表示主要标题，如“个人简历”，`<p>`用于段落，展示个人信息、工作经历等内容...
前端开发主要使用 HTML、CSS 和 JavaScript 来实现
最新发布
07-12
#### 一、前端开发定义及作用 前端开发，又称客户端开发，指的是创建和维护网站或应用程序的用户界面和用户体验的过程。它侧重于可视化的部分，即用户可以直接看到并与之互动的部分。前端开发的核心在于提供直观、...
知乎网站的登录前端源码
02-28
前端的验证只能作为初步防护，真正的安全验证应在后端完成，防止恶意攻击。比如，前端可以检查用户名和密码的长度，但必须在后端进行更复杂的校验，如SQL注入防护、密码哈希等。 总的来说，"zhihu_login-master...
实践，制作一个高扩展、可视化低代码前端，详实、完整
悠闲的水的博客
03-01 1285
RxEditor是一款开源企业级可视化低代码前端，目标是可以编辑所有 HTML 基础的组件。本文介绍了其实现机制。
蓉车宝前端代码 店铺入驻页面 店铺页面 java
01-08
【标题】"蓉车宝前端代码 店铺入驻页面 店铺页面 java"涉及的知识点主要涵盖前端开发、软件架构以及Java后端编程。在这个项目中，开发者将构建一个线上平台，允许商家进行店铺的入驻操作，并展示店铺页面。下面我们...
网站前端html
01-10
自用响应式网站前端开发代码，下载即用。一般公司主站的样式。
前端最基本html代码，可以执行
03-30
自己写的一个html基础页面，主要包括三部分内容。 1、鼠标滑动用js显示div 2、同一行布局三个元素 3、鼠标hover用css显示div
html前台页面
08-18
很不错的前台静态页面。直接可以在里边添加业务逻辑。可以进行二次开发。
H5高端创意滚屏科技公司前端html源码模板
10-12
使用前端企业网站，h5效果，支持移动端和pc端，静态页面
js实现前端网页HTML
06-04
简单的网页切换，个人简介，基本的js效果，图片切换，跑马灯效果、
求前端html代码,前端之HTML(示例代码)
weixin_30513765的博客
06-09 270
HTMLHTML是什么超文本标记语言(Hypertext Markup Language, HTML)是一种用于创建网页的标记语言。本质上是浏览器可识别的规则，我们按照规则写网页，浏览器根据规则渲染我们的网页。对于不同的浏览器，对同一个标签可能会有不同的解释。(兼容性问题)网页文件的扩展名：.html或.htmHTML语言的特点是所见即所得，它没有什么逻辑性web服务本质浏览器发请求 -->...
前端代码开发规范-html篇
qq_22010473的博客
05-23 524
目录 一、html 头部 1、为每个 HTML 页面的第一行添加标准模式（standard mode）的声明， 这样能够确保在每个浏览器中拥有一致的表现。 <!DOCTYPE html> 2、使用 lang="zh-cmn-Hans" 而不是我们通常写的 lang="zh-CN"。理由：参考：https://www.zhihu.com/question/20797118 &...
Web前端-HTML
weixin_46051964的博客
09-09 880
表单可以用来收集用户的数据,提交表单时，可以向服务器发送请求，并且还可以携带用户填写的数据。
HRM系统前端代码示例：自定义与扩展指南
在这个基本的人力资源管理系统（HRM）前端代码示例中，我们关注的是用户界面的构建和与后端接口的初步集成。前端代码主要展示了以下几个关键部分： 1. **HTML结构**: - 代码使用了HTML5文档类型，定义了一个包含`...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

夜雨听枫氵

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值