HTML和CSS基础是什么

本篇文章为大家展示了HTML和CSS基础是什么,内容简明扼要并且容易理解,绝对能使你眼前一亮,通过这篇文章的详细介绍希望你能有所收获。

10年积累的网站建设、成都网站制作经验,可以快速应对客户对网站的新想法和需求。提供各种问题对应的解决方案。让选择我们的客户得到更好、更有力的网络服务。我虽然不认识你,你也不认识我。但先网站设计后付款的网站建设流程,更有七星免费网站建设让你可以放心的选择与我们合作。

一、简介

HTML指的是超文本标记语言,使用标记标签来描述网页,标签是由尖括号和关键词组成,并且是成对出现,例如<html></html>。

二、一个完整的html网页

<!DOCTYPE html>  <!-- 有助于浏览器中正确显示网页 --><html>  <!-- html页面开始标签 --><head><meta charset="UTF-8">  <!-- UTF-8编码  --><title>周杰伦</title> <!-- 标签页显示的内容 --></head><body><img src="1.jpg"> <!-- 插入一张图片 --><h2>《说好不哭》</h2><h4>词:方文山   曲:周杰伦</h4><h4>演唱:周杰伦/五月天阿信<h4><!-- h2-h6不同大小字体 --><hr> <!-- 水平线 -->没有了联络  后来的生活  我都是听别人说<br><!-- 换行标签 -->说你怎么了  说你怎么过  放不下的人是我<br>人多的时候  就待在角落  就怕别人问起我<br></body></html> <!-- html页面结束标签 -->

效果如下:

HTML和CSS基础是什么

三、其他标签介绍

1、div和span标签

div是一个块级元素,它包含的元素会自动换行。

span是行内元素,在它的前后不会换行

<div style="color:#0000FF">你们怎么了  你低着头</div>  护着我连抱怨都没有<span style="color:#0000FF">电话开始躲  从不对我说</span>  不习惯一个人生活

HTML和CSS基础是什么

2、a标签,超链接

href:指定要跳转的地址

target:指定方式打开新地址,默认当前页面打开,_blank在新页面打开

<a href="https://www.baidu.com" target="_blank">百度一下</a>

3、<img>标签,插入图片

./:本级目录

../:父级目录

也可以直接添加网络上的一张图片

<img src="./1.jpg"> <!-- 插入一张图片 --><img src="../1.jpg"> <!-- 插入一张图片 --><img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1590819401582&di=55b578406cd4b1649ab0ec90d49e5b98&imgtype=0&src=http%3A%2F%2Ffile02.16sucai.com%2Fd%2Ffile%2F2014%2F0829%2Fb871e1addf5f8e96f3b390ece2b2da0d.jpg"><!-- 插入一张图片 -->

四、CSS样式, 用于渲染HTML元素标签的样式

1、内联样式

span,将所有span标签内的文字都统一样式

<style type="text/css">span{background-color:#000000; <!-- 黑底 -->color:#00FF00;<!-- 绿字 -->}</style><span>离开我以后  要我好好过  怕打扰想自由的我</span><span>都这个时候  你还在意着  别人是怎么怎么看我的</span><span>拼命解释着  不是我的错  是你要走</span>

HTML和CSS基础是什么

id选择器,为一个样式起个别名,通过id引用

<style type="text/css">#TS{background-color:#000000; <!-- 黑底 -->color:#FF00FF;            <!-- 粉字 -->}</style><span>离开我以后  要我好好过  怕打扰想自由的我</span><span id="TS">都这个时候  你还在意着  别人是怎么怎么看我的</span><span>拼命解释着  不是我的错  是你要走</span>

HTML和CSS基础是什么

类选择器,为一个样式起个别名,通过class引用

<style type="text/css">#TS{background-color:#000000;<!-- 黑底 -->color:#FF00FF;<!-- 绿字 -->}.ST{background-color:#000000;<!-- 黑底 -->color:#00FFFF;  <!-- 蓝字 -->}</style><span id="TS">离开我以后  要我好好过  怕打扰想自由的我</span><span id="TS">都这个时候  你还在意着  别人是怎么怎么看我的</span><span>拼命解释着  <span class="ST">不是我的错</span>  是你要走</span>

HTML和CSS基础是什么

2、外引样式

新建一个aiyou.css文件,内容为

#TS{background-color:#000000;color:#FF00FF;}.ST{background-color:#000000;color:#00FFFF;}

在html源码中引用

<link rel="stylesheet" type="text/css" href="aiyou.css"><span id="TS">离开我以后  要我好好过  怕打扰想自由的我</span><span id="TS">都这个时候  你还在意着  别人是怎么怎么看我的</span><span>拼命解释着  <span class="ST">不是我的错</span>  是你要走</span>

HTML和CSS基础是什么

上述内容就是HTML和CSS基础是什么,你们学到知识或技能了吗?如果还想学到更多技能或者丰富自己的知识储备,欢迎关注创新互联行业资讯频道。

网站标题:HTML和CSS基础是什么
网页URL:https://www.cdcxhl.com/article10/pihhdo.html

成都网站建设公司_创新互联,为您提供动态网站网页设计公司移动网站建设品牌网站设计ChatGPT网站建设

广告

声明:本网站发布的内容(图片、视频和文字)以用户投稿、用户转载内容为主,如果涉及侵权请尽快告知,我们将会在第一时间删除。文章观点不代表本网站立场,如需处理请联系客服。电话:028-86922220;邮箱:631063699@qq.com。内容未经允许不得转载,或转载时需注明来源: 创新互联

微信小程序开发