首页的css】的更多相关文章

[本文为原创,转载请注明出处] 技术[CSS+HTML]   布局[Table] 图片准备[百度图标.10张不同类型图] ------------------------------------------------------------------------------------------------------------ 步骤1  table 布局 <!DOCTYPE html> <html lang="en"> <head> <…
这是效果图,因为太长,缩略了. 在学习HTML和CSS基础的时候做的.自己切图下来做的. 没有什么技术含量. 源代码和图片我放在github上了, 上个链接吧: https://github.com/richard952465/Only_index 有兴趣改造它的可以弄下.…
一.CSS概述###<1>概念 DIV,就是一个HTML元素,块级元素,通常结合CSS进行页面的布局. CSS,层叠样式表,给HTML元素增强显示. ###<2>作用 样式定义如何显示HTML元素,页面的布局(美化HTML效果) ###<3>使用方式 内联样式方式:在当前的元素属性中直接设置style属性,适用性差,只能作用于当前元素. style属性是HTML元素通用的属性 内部样式方式:在head标签中,使用<style>标签来设置样式,适用性强,可以同…
html,body{ margin:; padding:; background-color: lavenderblush; } a{ color:darkgray; } li{ list-style: circle; } /*页首*/ #header{ /*background: -webkit-linear-gradient(rgba(0,0,0,1), transparent); /* Safari 5.1 - 6.0 background: -o-linear-gradient(rgba…
无论是从技术角度还是开发视角,对于web前端开发规范文档都有一定规范,本文就css3和html5的发展前景总结了一系列的web开发文档,仅供大家参考. 规范目的: 为提高团队协作效率, 便于后台人员添加功能及前端后期优化维护, 输出高质量的文档, 特制订此文档. 本规范文档一经确认, 前端开发人员必须按本文档规范进行前台页面开发. 本文档如有不对或者不合适的地方请及时提出, 经讨论决定后方可更改. 基本准则: 符合web标准, 语义化html, 结构表现行为分离, 兼容性优良. 页面性能方面,…
最近在网站首页上想将Banner壁纸给做到后台上传随时更改的效果.遇到问题便是:将上传的图片路径动态添加到首页css代码中,结果尝试了网上提供的思路,更改相对路径,换为url中“../../Content/”以及“./Content/”之类的,但实际操作并没能实现新上传的图片路径加载到css代码中.首页部分css代码贴出: /*--banner--*/ .banner { background:url(../images/banner-1.jpg) no-repeat 0px 0px; back…
HTML CSS + DIV实现整体布局 1.技术目标: 开发符合W3C标准的Web页面 理解盒子模型 实现DIV+CSS整体布局 2.什么是W3C标准? W3C:World Wide Web Consortium,万维网联盟    W3C的职能:负责制定和维护Web行业标准    W3C标准包括一系列的标准: HTML内容方面:XHTML 样式美化方面:CSS 结构文档访问方面:DOM 页面交互方面:ECMAScript ……等等 3.W3C倡导的Web结构要符合以下要求: XHTML负责内容…
1.js放在head中会立即执行,阻塞后续的资源下载与执行.因为js有可能会修改dom,如果不阻塞后续的资源下载,dom的操作顺序不可控. 正常的网页加载流程是这样的. 浏览器一边下载HTML网页,一边开始解析 解析过程中,发现<script>标签 暂停解析,网页渲染的控制权转交给JavaScript引擎 如果<script>标签引用了外部脚本,就下载该脚本,否则就直接执行 执行完毕,控制权交还渲染引擎,恢复往下解析HTML网页 如果外部脚本加载时间很长(比如一直无法完成下载),就…
原文链接:http://www.zhangxinxu.com/wordpress/2010/07/css%E7%9A%84%E6%A0%B7%E5%BC%8F%E5%90%88%E5%B9%B6%E4%B8%8E%E6%A8%A1%E5%9D%97%E5%8C%96/ 一.引言 本文的核心观点为CSS的合并与模块化,似乎与前一篇文章“CSS样式的再分离”有矛盾,其实不然,分离可以精简CSS代码,合并也可以精简CSS代码,一切都是权衡!或是说是在恰当的情况下使用恰当的手段. 正如前文所提到的,分离…
1.js放在head中会立即执行,阻塞后续的资源下载与执行.因为js有可能会修改dom,如果不阻塞后续的资源下载,dom的操作顺序不可控. 正常的网页加载流程是这样的. 浏览器一边下载HTML网页,一边开始解析 解析过程中,发现<script>标签 暂停解析,网页渲染的控制权转交给JavaScript引擎 如果<script>标签引用了外部脚本,就下载该脚本,否则就直接执行 执行完毕,控制权交还渲染引擎,恢复往下解析HTML网页 如果外部脚本加载时间很长(比如一直无法完成下载),就…
根据目前彩票行业的公司进行css命名的层级解析,此次选择了网易彩票,QQ彩票,澳客彩票网,中国竞彩网,500.com,彩票365,新浪彩票,新浪爱彩,凤凰彩票,淘宝彩票的首页进行css命名的采集和分析. 这篇文章来源于我的一个困惑.前端编写代码时你是否出现过不知道怎么命名的时候,冥思苦想,百思不得其解.而且不光是想不出来,慢慢发现周围人每个人都有自己的命名风格,大家组合在一起,也是各成一派.我在想是不是只有我有这样的困惑,于是我想着去了解行业的网站命名的方法.这篇文章也许可以给你一些启示. 1.…
      规范目的 为提高团队协作效率,便于后台人员添加功能及前端后期优化维护,输出高质量的文档,特制订此文档.本规范文档一经确认,前端开发人员必须按本文档规范进行前台页面开发.本文档如有不对或者不合适的地方请及时提出,经讨论决定后方可更改. 基本准则 符合web标准,语义化html,结构表现行为分离,兼容性优良.页面性能方面,代码要求简洁明了有序,尽可能的减小服务器负载,保证最快的解析速度. 文件规范 1.html,css,js,images文件均归档至<系统开发规范>约定的目录中; 2.…
讲讲常见的一些没有必要使用CSS代码情况,而这些不起作用可以去掉的CSS代码可能是我们经常忽视的.越是对CSS理解不够,越容易出现这些问题. 二.一些常见不必要CSS样式 1.与默认CSS样式一致 我们有时候写的CSS样式会与浏览器默认的CSS样式一致,有时候您自己都可能没有意识到. 常见的例子有: ① div{width:auto; height:auto;} 对于一些刚使用CSS的童鞋,有时候,其为了表达这段div高度是自动适应于内部元素的,会情不自禁的加上height:auto;的样式.很…
by zhangxinxu from http://www.zhangxinxu.com 原文地址:http://www.zhangxinxu.com/wordpress/?p=931 一.引言 本文的核心观点为CSS的合并与模块化,似乎与前一篇文章“CSS样式的再分离”有矛盾,其实不然,分离可以精简CSS代码,合并也可以精简CSS代码,一切都是权衡!或是说是在恰当的情况下使用恰当的手段. 正如前文所提到的,分离可以精简CSS,但是同时会带来巨大的HTML代码的开销,显然,对所有的样式进行再分离…
HTML CSS + DIV实现局部布局 HTML CSS + DIV实现局部布局 1.本章教大家掌握2种布局方式: 1)顶部导航菜单布局,效果图: 2)购物版块布局,效果图: 2.技术目标: 使用div + ul-li实现导航菜单布局     使用div + dl-dt-dd实现购物版块布局 3.一般的局部布局无非采用如下的技术:     1)div + ul(ol)-li:用于分类导航或菜单等场合     2)div + dl-dt-dd:用于图文混编场合     3)table-tr-td…
虽然写过很多css代码,但每次动手写都让我痛苦不堪,如何组织好那一堆堆的代码,如何提高代码复用率,甚至如何命名类,这些都让我纠结.下面的浅显的谈一谈在看了<编写高质量代码>中的html和css部分以及搜索网络上一些相关资料对编写高质量的HTML和CSS的一些基本认识. HTML 在说css之前必须先说说html ,没有它css是浮云.就像是要建栋别墅,光有那些装饰品(css)没有房子基本的结构(html)是不可能造出真正好看又实用的别墅的.其实html结构并不是简单的table或一堆堆的div…
Day9:html和css <head> <meta charset="UTF-8"> <title></title> <meta name="description" content="" /> <meta name="Keywords" content="" /> <link rel="shortcut icon&q…
效果图: html: <div class='site_bar'>首页</div> css: .site_bar{ background-image : linear-gradient(red,red); background-position : center bottom; background-size : 0 2px; background-repeat : no-repeat;  //这个属性不能少. transition : .3s; } .site_bar:hover…
http://blog.csdn.net/mercop/article/details/7882000 HTML CSS + DIV实现整体布局 1.技术目标: 开发符合W3C标准的Web页面 理解盒子模型 实现DIV+CSS整体布局 2.什么是W3C标准? W3C:World Wide Web Consortium,万维网联盟    W3C的职能:负责制定和维护Web行业标准    W3C标准包括一系列的标准: HTML内容方面:XHTML 样式美化方面:CSS 结构文档访问方面:DOM 页面…
HTML CSS + DIV实现整体布局 1.技术目标: 开发符合W3C标准的Web页面 理解盒子模型 实现DIV+CSS整体布局 2.什么是W3C标准? W3C:World Wide Web Consortium,万维网联盟    W3C的职能:负责制定和维护Web行业标准    W3C标准包括一系列的标准: HTML内容方面:XHTML 样式美化方面:CSS 结构文档访问方面:DOM 页面交互方面:ECMAScript ……等等 3.W3C倡导的Web结构要符合以下要求: XHTML负责内容…
9.盒模型的层次关系 我们通过一个经典的盒模型3D立体结构图来理解,如图:     从上往下看,层次关系如下: 第1层:盒子的边框(border),     第2层:元素的内容(content).内边距(padding)     第3层:背景图(background-image)     第4层:背景色(background-color)     第5层:盒子的外边距(margin) 从这个层次关系中可以看出,当同时设置背景图和背景色时,背景     图将在背景色的上方显示 10.margin外…
目录 昨日回顾 一.HTTP协议 (一)四大特性 (二)数据格式 (1)请求格式 (2)响应格式 (三)响应状态码 二.HTML (一)什么是HTML (二)注释 (三)文档结构 (四)head内标签 (五)body内标签 (1)常用标签 (2)重要标签 (3)重要符号 (六)标签分类 (1)自闭和标签和双标签 (2)块级标签和行内标签 今日内容 一.form表单 (一)什么是form表单 (二)参数 (1)action (2)method (3)enctype (4)novalidate (三…
form表单(******) 能够获取用户输入(输入,选择,上传的文件) 并且将用户输入的内容全部发送给后端 参数 action 控制数据提交的地址 三种书写方式 1.不写 默认就是朝当前这个页面所在的地址提交数据 2.写全路径(https://www.baidu.com) 3.只写路径后缀(/index/) method 控制数据提交的方式 get form表单默认是get请求 post 通常情况下input需要结合label一起使用 <label for="d1">用户…
1.js放在head中会立即执行,阻塞后续的资源下载与执行.因为js有可能会修改dom,如果不阻塞后续的资源下载,dom的操作顺序不可控.正常的网页加载流程是这样的.浏览器一边下载HTML网页,一边开始解析解析过程中,发现<script>标签暂停解析,网页渲染的控制权转交给JavaScript引擎如果<script>标签引用了外部脚本,就下载该脚本,否则就直接执行执行完毕,控制权交还渲染引擎,恢复往下解析HTML网页 如果外部脚本加载时间很长(比如一直无法完成下载),就会造成网页长…
初始CSS 一.form表单补充 form表单关键性的属性补充 form表单 关键性的属性 action 控制的是数据的提交路径 1.不写 默认是朝着当前页面所在的地址提交 2.全路径 3.后缀(/index/) method 控制的是提交方式 form表单默认是get请求 method='get' 你也可以指定成post请求 method='post' enctype 控制的是数据提交的编码格式 默认情况下form表单是不能够直接发送文件的 如果你要发送文件 必须将该参数由默认的urlenco…
今天在做搜索框中的提示语下拉的时候,提示框把搜索框的底部的border遮住,导致看起来不是很美观: 因为下方的提示框是用js后加载的它的样式也是随着js一起加载的,而这个js和它的css我们是不能改动的.如果直接一开始就使用css设置,卸载首页的css文件中,当focus输入框的时候,输入框的css是后加载进来以及渲染的,以至于我们看到的结果是一开始写在首页css文件中的样式被后面加载的样式覆盖了: 方案一:使用js定时器,当focus后延时一会儿大概255ms左右,再来渲染提示框的上边框颜色,…
目录 CSS快速入门(四) 浮动 float属性 clear属性 浮动解决的问题及其影响 解决父标签塌陷的方法 浮动案例 定位 什么是脱离文档流 定位的两种方法 position定位 static定位 relative定位 absolute定位 fixed定位 overflow溢出属性 层级属性z-index 透明度的设置 综合案例 CSS快速入门(四) 浮动 float属性 用于设置元素是否浮动,absolute(绝对)定位的元素会忽略float属性 属性值 描述 none 默认值,元素不浮动…
03.CSS介绍 层叠样式表:就是给HTML标签添加养的,让他变的更加的好看 注释: /*单行注释*//*多行注释1多行注释2多行注释3*/通常我们在写CSS样式的时候也会用注释来划定样式区域(因为HTML代码多所以对应的CSS代码也会很多)/* 这是博客园首页的CSS样式文件*//*顶部导航条样式*//*左侧菜单栏样式*//*右侧菜单栏样式*/​# CSS的语法结构选择器{属性1:值1;      属性2:值2;    属性2:值2;   }​# css的三种引入方式1.style标签内部直接…
本文转载自谈笑涧<WEB前端开发规范文档> 为 新项目写的一份规范文档, 分享给大家. 我想前端开发过程中, 无论是团队开发, 还是单兵做站, 有一份开发文档做规范, 对开发工作都是很有益的. 本文档由本人编写, 部分意见来源于网络, 以此感谢, 片面及有误的地方, 希望大家指正. 另, 本文档部分规范是为我所在项目组所写, 使用时请根据实际项目需求修改.以下为[WEB前端开发规范文档]正文点此查看WEB版本 规范目的 为提高团队协作效率, 便于后台人员添加功能及前端后期优化维护, 输出高质量…
第一条.尽可能的减少 HTTP 的请求数 (Make Fewer HTTP Requests ) http请求是要开销的,想办法减少请求数自然可以提高网页速度.常用的方法,合并css,js(将一个页面中的css和js文件分别合并)以及 Image maps和css sprites等.当然或许将css,js文件拆分多个是因为css结构,共用等方面的考虑.阿里巴巴中文站当时的做法是开发时依然分开开发,然后在后台 对js,css进行合并,这样对于浏览器来说依然是一个请求,但是开发时仍然能还原成多个,方…