![](https://img-blog.csdnimg.cn/20201014180756928.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
html5+css3+js
文章平均质量分 58
顾小笙
这个作者很懒,什么都没留下…
展开
-
html5+css3(二十)盒子模型
盒子模型我们可以把每一个HTML标记,都看成是一个“盒子”。这个“盒子”有哪些特征:内容的高度或高度、边框线、内填充、外边距。“盒子”的总宽度:内容的宽度 + 边框宽度*2 + 左填充*2 + 左外边距*2上下外边距合并问题——这是一种现象什么情况下?上下外边距会合并呢?上下两个块元素,如果每一个元素都指定了四个外边距,那么上下相邻的那个外边距会发生合并的现象,合并后取其中较大的外边距。如何要实现上下两个<div>之间的距离为100px,该如何实现呢?上下原创 2021-03-31 16:50:35 · 273 阅读 · 0 评论 -
html5+css3(十九)HTML引入CSS的方法
HTML引入CSS的方法1、嵌入式通过<style>标记,来引入CSS样式。语法格式:<style type = “text/css”></style>提示:<style>中的CSS样式,只能给当前网页来使用。同一个网页中,<style>标记可以多次出现2、外联式通过<link>标记,来入引一个外部的CSS文件(.css),这样的话,可以实现公共的CSS代码被多个网页共享。<link...原创 2021-03-31 16:48:13 · 1439 阅读 · 0 评论 -
html5+css3(十八)CSS定位
CSS定位position:元素定位方式,取值static、fixed、relative、absolute static:静态定位(默认状态、不定位)。 Fixed:固定定位。 Relative:相对定位。 Absolute:绝对定位。定位方式,要与定位属性配合使用定位坐标:指定定位的元素,偏移目标元素多远的距离。 left:定位元素,距离目标元素左边的距离。 top:定位元素,距离目标元素上边的距离。 right:定位元素,距离目标元素右边的距离。 bottom:定位元素,距离目原创 2021-03-27 18:03:09 · 120 阅读 · 0 评论 -
html5+css3(十七)CSS继承性 优先级 display属性 overflow属性 cursor光标类型
CSS继承性CSS属性继承:外层元素的样式,会被内层元素进行继承。多个外层元素的样式,最终都会“叠加”到内层元素上。什么样的CSS属性能被继承呢?CSS文本属性都会被继承的:color、 font-size、font-family、font-style、 font-weighttext-align、text-decoration、text-indent、letter-spacing、line-height提示:<body>中的CSS属性,会被所有的子元素继承。CS原创 2021-03-27 18:00:51 · 353 阅读 · 0 评论 -
html5+css3(十六)CSS浮动和清除
CSS浮动和清除float:让元素浮动,取值:left(左浮动)、right(右浮动) clear:清除浮动,取值:left(清除左浮动)、right(清除右浮动)、both(同时清除上面的左浮动和右浮动)1、CSS浮动浮动的元素,将向左或向右浮动,浮动到包围元素的边上,或上一个浮动元素的边上为止。 浮动的元素,不再占空间了,并且,浮动元素的层级要高于普通元素。 浮动的元素,一定是“块元素”。不管它原来是什么元素。 如果浮动的元素,没有指定宽度的话,浮动后它将尽可能的变窄。因此,浮动.原创 2021-03-27 17:56:12 · 146 阅读 · 0 评论 -
html5+css3(十五)属性
CSS注释CSS注释:/*CSS注释内容*/HTML注释:<!—HTML注释-->CSS尺寸属性width:元素宽度,一定要加px单位。 height:元素高度。CSS字体属性font-size:文字大小。如:font-size:14px; font-family:字体。如:font-family:微软雅黑; font-style:斜体,取值:italic。如:font-style:italic; font-weight:粗体,取值:bold。如:font-w.原创 2021-03-27 17:53:09 · 264 阅读 · 0 评论 -
html5+css3(十四)CSS选择器
CSS选择器1、基本选择器(1)“*”选择器:通配符描述:将匹配所有的HTML标记,所有的标记都会改变的。 语法:*{ color:red; } 注意:“*”尽量少用,因为IE6不支持。(2)标签选择器描述:将匹配指定的HTML标记。 语法:h1{ color:red; } 注意:CSS标签选择器,与HTML标记的名称一样,但不能加尖括号。(3)class选择器(类选择器)——类选择器是使用频率最高的描述:给一类HTML标记加样式。这里所指的“一类”是..原创 2021-03-27 17:48:31 · 140 阅读 · 0 评论 -
html5+css3(十三)CSS简介 语法格式
CSS简介CSS Cascading Style Sheets 层叠样式表。CSS的主要目的:是给HTML标记添加各种各样的表现(格式、样式)。比如:文字样式、背景、文本样式、链接样式。提示:CSS是给HTML标记加的样式;JS是给HTML标记加的行为。HTML标记是最先出现的。HTML超文本标注语言:各种HTML标记。 CSS层叠样式表:给HTML标记加的样式。 JavaScript脚本程序:给HTML标记加的程序。CSS语法格式一个CSS规则,由“选择器”和..原创 2021-03-27 17:43:07 · 159 阅读 · 0 评论 -
html5+css3(十二)普通框架
普通框架1、框架的概念框架技术:将一个浏览器窗口划分成若干个小窗口,每个小窗口显示一个独立的网页。2、框架集和框架页框架集<frameset>:主要用来划分窗口的。框架页<frame>:主要用来指定窗口默认显示的网页地址。框架与窗户很像。一个窗户由窗格(框架集)和玻璃(框架页)构成。先规划窗格,然后再确定每个窗格中放的玻璃。(先有结构,后有内容)框架网页的DTD必须是:<!DOCTYPE html PUBLIC "-//...原创 2021-03-27 17:37:48 · 509 阅读 · 0 评论 -
html5+css3(十一)图片热点(图像地图)
图片热点(图像地图)图像热点:给一张图片加多个链接,默认情况下,一张图只能加一个链接。1、标记结构:<img src = “images/01.jpg”usemap = “#Map”/><map id = “Map”name = “Map”><area shape = “热区形状”coords= “热区坐标”href = “链接地址”/><area shape = “热区形状”coords= “热...原创 2021-03-27 17:35:07 · 1035 阅读 · 0 评论 -
html5+css3(十)表单
1、表单的概念表单主要用来获取客户端用户数据(信息)的。如:注册表单、查询表单、登录表单等。2、表单的工作原理浏览有表单的网页,填写一些必要的信息,然后点击某个按钮进行提交。 这些表单数据,通过互联网,传递到了服务器上。 服务器上有专门的程序,对表单数据进行验证。如果验证成功,将你的数据存入数据库(MySQL),则返回一个验证成功的信息。如果验证失败,将返回一个错误信息。从上面表单的工作原来看:表单的制作分两个部分,一是前台页面的制作,二是后台PHP对表单数据的处理。3、表单的结构原创 2021-03-26 16:43:17 · 252 阅读 · 0 评论 -
html5+css3(九)表格标签
表格标签——块元素 1、表格的结构<table><tr><td></td><td></td><td></td><td></td></tr>&l...原创 2021-03-25 18:55:50 · 127 阅读 · 1 评论 -
html5+css3(八)<meta>标记
<meta>标记<meta>的主要作用,是提供网页的元信息。比如:指定网页的搜索关键字。<meta>标记有两个属性:http-equiv和name。1、http-equiv属性功能:模拟http协议文件头信息,当信息从服务器端传到客户端时,告诉浏览器如何正确的显示网页内容。 http-equiv属性一般要与content属性配合使用。Content属性指定信息的详细参数。(1)设置网页的字符集<meta http-equiv="Content原创 2021-03-25 18:55:01 · 129 阅读 · 0 评论 -
html5+css3(七)锚点链接
锚点链接含义:锚点链接,是在一个网页的不同区域进行跳转。锚点理解为“定义记号”。 定义锚点(作个记号):<a name = “锚点名称”></a> 锚点名称的命名规则:可以包含字母、数字、下划线,但只能以字母开头。 注意:<a>和</a>之间没有内容,换句话说:这个记号不是让我们看的,而是给链接用的。 例如:<a name = “top2”></a> 跳转到锚点(记号): 语法:<..原创 2021-03-25 18:54:07 · 902 阅读 · 0 评论 -
html5+css3(六)颜色表示
html颜色表示网页中的颜色有三种表示方法:颜色单词:blue、green、red、yellow 10进制表示:rgb(255,0,0)、rgb(0,255,0)、rgb(0,0,255) 16进制表示:#FF0000(红)、#00FF00(绿)、#0000FF(蓝)自界面中,所有的颜色都可以用三种光的不同波长混合而成。这三种光就是红光(red)、绿光(green)、蓝色(blue)。在计算机中,每个基色,用8位二进制(2^8 = 256),那么RGB共可以表示 256*256*25.原创 2021-03-25 18:53:15 · 502 阅读 · 0 评论 -
html5+css3(五)图片标签 超级链接
图片标记:行内元素、单边标记语法格式:<img 属性 = “值”> 常用属性 Width:图片宽度 Height:图片高度 Border:图片边框粗细。 Src:图片的路径(相对路径) Align:图片的水平对齐方式,取值:left、center、right Hspace:图片与左右文字之间的距离(水平距离) Vspace:图片与上下文字之间的距离(垂直距离)。 注意事项 如果图片想等比例缩放,只需要指定width或heig.原创 2021-03-25 18:51:36 · 519 阅读 · 0 评论 -
html5+css3(四)字符实体 列表
HTML字符实体空格:代表一个半角空格。一个汉字是2个字节。1个字节相当于1个半角空格。 <:< >:> &:& ¥:¥ ×:× ÷:÷HTML项目符号(无序列表)<ul><li>内容1</li><li>内容2</li><li>内容3</li></ul><ul>或<li>的常用属性type:项目符号的类.原创 2021-03-25 18:45:50 · 375 阅读 · 0 评论 -
html5+css3(二)文件结构
HTML文件结构<html><head><title>新浪首页</title></head><body>网页正文……</body></html>HTML文件结构的说明:<html></html>标记的含义:告诉浏览器,其中的代码用什么格式(图片、视频)来编译。 <head></head>标记的含义:告诉浏览器,网页中的汉字用原创 2021-03-25 18:38:20 · 189 阅读 · 0 评论 -
html5+css3(一)简介
HTML简介HTML,Hypertext Markup Language ,超文本标注语言。HTML是一种规范,是一种标准,编写网页的一种标准。超文本:就是网页上不光有文本,还有图片、音乐、视频等。标注:是一种记号,是一种标志。如:红绿灯语言:这里的“语言”就是代码,跟所谓“程序语言”一点关系都没有。HTML的主要目的:就是用来显示网页的不同效果、不同部分。如:<b>文本</b>HTML文件结构<html><head>.原创 2021-03-25 18:36:51 · 284 阅读 · 0 评论