html及css
otatoz
生死契阔 与子成说
展开
-
css动画实现呼吸路灯
利用css的动画可以实现一个呼吸灯:(此处是呼吸路灯)效果如下:代码如下:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title></head><body> &...原创 2019-07-18 16:49:02 · 700 阅读 · 0 评论 -
清除浮动的三种方法
浮动布局,float:left;会使当前元素脱离文档流,从而失去对父级元素的支撑,如果此时父级元素没有设置高度,下面的元素就会挤上去,因此需要清除浮动清除浮动的三个常用方法:给浮动元素的父级元素设置overflow:hidden; 在浮动元素的同级下添加一个空标签,并且设置clear:both; 浮动元素的父级元素使用::after{clear:both;content:'';disp...原创 2019-06-28 15:53:19 · 5784 阅读 · 0 评论 -
CSS选择器
选择器可分为基本选择器、层次选择器、属性选择器、伪类选择器、伪元素选择器 1、基本选择器id选择器#test{} 选中id为test的元素类选择器.test{} 选中类为test的元素标签选择器h1{} 选中h1标...原创 2019-06-26 17:26:36 · 206 阅读 · 0 评论 -
CSS基础
1、什么是CSS?CSS (Cascading Style Sheets)层叠样式表,是一个用于修饰文档(可以是标记语言HTML,也可以是XML)的语言,可以将文档以更优雅的形式呈现给用户2、CSS声明CSS规则主要由两个部分组成:选择器、一条或者多条声明(每个声明由属性与值构成,属性和值通过冒号隔开)h1{ font-size:10px;}3、CSS声明块...原创 2019-06-26 16:17:38 · 112 阅读 · 0 评论 -
消除a标签默认样式
这是a标签默认的样式。改变字体颜色<a href="#" style="color: black;">我是测试</a>去除下划线<a href="#" style="text-decoration:none;color: black;">我是测试</a>...原创 2019-05-09 20:36:16 · 26261 阅读 · 2 评论 -
子元素在父元素中垂直、水平居中——四种方法
对父元素定位1-父子元素进行定位,对子元素绝对定位,子元素margin:auto;top:0;left:0;bottom:0;right:0; (定位布局)<div style="width:200px;height:200px; border:solid blue; position:relative;"> ...原创 2018-10-24 19:10:14 · 17696 阅读 · 0 评论 -
前端面试题—css盒子模型
面试官:请说说你对与css盒子模型的理解。我们回答的时候应该分为以下三点来说盒子模型的概念 盒子模型的组成 盒子模型的分类盒模型的概念盒子模型(box model)。网页中,每一个元素都占有一定的空间,无论是div、h1~h6、还是p,都可以看成是盒子。盒子模型的概念可以结合我们日常生活中的“箱子”来理解,日常生活中所见的“箱子”可以装一些物品,而我们这里说到的盒模型,同...原创 2018-10-31 16:44:21 · 14895 阅读 · 2 评论 -
html做表格(个人简历)
首先要知道表格中的几个重要属性:align:让内容居中,取值为left、right、centerborder:设置表格的边框cellspacing:单元格与单元格之间的距离bgcolor:表格的背景色colspan:跨列数rowspan:跨行数代码:<!DOCTYPE html><html lang="en"><head&...原创 2018-07-30 23:13:07 · 31934 阅读 · 5 评论 -
CSS样式相关小结
1 . CSS 指的是Cascading Style Sheets2. 哪个HTML 属性可用来定义内联样式?Style3. 如何改变某个元素的文本颜色? color(不是text-color)4. 哪个 CSS 属性可控制文本的尺寸(字体大小)? font-size(不是text-size)5. 可使所有 <p> 元...原创 2018-08-03 09:00:45 · 171 阅读 · 0 评论 -
浮动与绝对定位脱离文档流的区别
浮动脱离文档流先看代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title></head><style> *{ margin:0; padding:0; ...原创 2019-08-05 20:02:29 · 477 阅读 · 0 评论