前端
文章平均质量分 50
GreenSo
这个作者很懒,什么都没留下…
展开
-
6种css3鼠标滑过动画效果
<html> <head> <meta charset="utf-8" /> <title>6种css3鼠标滑过动画效果</title> <style type="text/css"> /*****全局样式*****/ *{padding:0;margin:0;font-family:"微软雅黑"}原创 2017-11-19 11:41:03 · 21415 阅读 · 0 评论 -
图文列表鼠标经过显示详情
<html> <head> <meta charset="utf-8" /> <title>图文列表鼠标经过显示详情</title> <style type="text/css"> .style1 ul li{float:left;margin:0 6px;position:relative;list-style:non原创 2017-11-19 16:39:56 · 758 阅读 · 1 评论 -
<title>鼠标悬停图片放大</title>
<!doctype html><html><head><meta charset="utf-8"><title>鼠标悬停图片放大</title><style type="text/css"> /*****鼠标悬停图片变大文字消失*****/ .style1 ul li{float:left;margin:0 6px;position:relativ原创 2017-11-19 15:52:38 · 2418 阅读 · 0 评论 -
鼠标悬停整体旋转
<!doctype html><html><head><meta charset="utf-8"><title>鼠标悬停整体旋转</title><style type="text/css"> .style3 ul li{float:left;margin:0 6px; position:relative;/*绝对定位元素*/原创 2017-11-19 15:51:02 · 419 阅读 · 0 评论 -
css 自适应宽度 需要设置的范围标准?
/* 超小设备(手机,小于 768px) */ /* Bootstrap 中默认情况下没有媒体查询 *//* 小型设备(平板电脑,768px 起) */ @media (min-width: @screen-sm-min) { … }/* 中型设备(台式电脑,992px 起) */ @media (min-width: @screen-md-min) { … }/* 大型设备(大台式电脑,12原创 2017-11-18 11:21:48 · 2466 阅读 · 0 评论 -
使用CSS3的@media来实现网页自适应
<!doctype html><html><head><meta charset="utf-8"><title>流体布局自适应</title><style type="text/css"> *{ padding:0 auto; margin:0 auto; } @media screen and (min-width: 1201px) { .naavp { col原创 2017-11-18 11:11:31 · 10303 阅读 · 0 评论 -
html前端命名规则
前端布局规范细则 一、命名规范: 1、基本要求:1)文件编码统一使用 UTF-8 编码; 2)命名时以符合语义为主要参考指标,CSS属性书写规范,采用统一风格及命名方法; 3)结构清晰,层级关系明朗,以不超过三级为标准; 4)同一表现形式的样式要求可重复利用,模块组件类的样式要求可整体外部移植; 5)编写 CSS 的时候,应当避免使用CSS Hack,能不用则不用。 6)所有原创 2017-11-18 10:51:32 · 30669 阅读 · 0 评论 -
a标签加入点击事件
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Ty原创 2017-11-18 09:12:52 · 2892 阅读 · 0 评论 -
纯css代金卷实例
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Ty原创 2017-11-18 09:08:52 · 616 阅读 · 0 评论 -
CSS3:linear-gradient切角画册
<!DOCTYPE HTML><html><head><meta charset="UTF-8" /><title></title><link rel='stylesheet' href='http://www.daqianduan.com/static/css/example.css' type='text/css' media='all' /></head><body><div c转载 2017-11-17 17:23:21 · 623 阅读 · 0 评论 -
css导航鼠标放置特效
<!doctype html><html><head><meta charset="utf-8"><title>导航样式</title><style>.nav li{text-align:center;/*text-align:cenner属性;使内部文字元素“水平”居中*/ width:80px; height:30px; list-原创 2017-11-18 17:23:39 · 727 阅读 · 0 评论 -
翘边阴影
<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>demo</title><style>ul{ list-style: none; /*list-style:none; 去除ul下li前的点*/}.box{/*下面整体块box*/ width: 980px; height: auto;原创 2017-11-19 10:32:11 · 302 阅读 · 0 评论 -
织梦手机端文章页图片被拉长解决方式
摘要转载 2017-11-20 15:41:06 · 4130 阅读 · 2 评论