div 里可以解析html,html基础知识解析(一)

本文分享了如何成为懂代码的设计师,从HTML基础知识解析开始,包括标签结构、属性语法、关键元素如<head>和<body>的应用,以及常用标签如标题、列表等的使用。同时介绍了如何利用大学期间的代码知识和实践经验,提升在设计与前端开发中的综合能力。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

随着岗位竞争的越来越激烈,而设计师掌握的技能要求也越多,设计师不光只会设计,而且也要懂(会)代码(会手写代码更会加金的),所以我们要做一位懂代码设计师,还好Jason在大学学过代码,毕业也做过一段时间的设计+前端,我将我在代码方面的知识总结分享给大家,赶紧往下看吧

a854ab02fabe2ea3b396418d1442b177.png

html基础知识解析(一)

基础认识

html语句是由标签+属性构成的

html 标签由开始标签和结束标签组成,开始标签是被括号包围的元素名,结束标签是被括号包围的斜杠和元素名,但某些 html 元素没有结束标签,比如
、,这类标签称为单标签。

721af6536d16ce0005caca941a202dee.png

html基础知识解析(一)

属性的语法

1、写在标签的<>内,而且在标签代码之后,如

2、属性名=""(一定得是英文的引号,不能是中文的引号。其实不用引号对于它的显示没有影响,但加上引号为标准做法)

如 align="center" align为属性名 center left right是属性值

3、有的标签没有任何属性(
),有的标签虽然有属性,但可以不加上也不影响它的使用(

)

64553d374cf2f11b42fdf3387095021a.png

html基础知识解析(一)

网页的基本结构

html,head,body 是html代码必不可少的三大标签,其中

html标签:用于定义html文件的标签,这个标签意味着这个文件是一个html文件

head标签:里面的内容不能再浏览器中直接呈现,但它会用后台运作的方式为html页面提供种种功能

body标签:里面出现的内容会在浏览器中得到直接呈现,供读者浏览

必须要记住的标签和属性

放在

之间的标签定义html文档的标题。与之间的内容将显示在浏览器窗口的标题栏。

891b17b68cdc0f56991df410e2652c25.png

html基础知识解析(一)

标签

标签类可以插入很多很有用的元素属性。常用的有以下四种:

用来标记搜索引擎在搜索你的页面时所取出的关键词。

用来标记文档的作者。

用来标记你的页面的解码方式。

用来自动刷新网页

4d464f5dc520c78666ff060a8efa7ab3.png

html基础知识解析(一)

放在

之间的

与文字相关的标签

文字标题

...

#=1, 2, 3, 4, 5, 6

段(paragraph)

空白占位符

换行

文字的分区显示

...
(#=left, center, right)

显示斜体文本效果。

呈现粗体文本效果。

呈现大号字体效果。

呈现小号字体效果。

a283e8c7425d12afa7f82c8a5b59c34d.png

html基础知识解析(一)

无序列表

无序列表是由

  • 元素定义的:
    • sports
    • food
    • drink
    • friends
    • 中均可加入type属性,type的属性值有:disc(圆)、circle(圆圈)、square(方块)

      有序列表 start 值为数字

      有序列表由

      1. 定义:
        1. sports
        2. drink
        3. friends

        ....................................................................

        我的微信公众号:UI严选 —越努力,越幸运

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值