自己在实践中遇到的一些前台基础(html、css)

   2015-08-12 0
核心提示:本节主要介绍了笔者在实践中遇到的一些前台基础,包括html、css等知识,下面将其整理与大家分享
1.

div css鼠标变手型是 cursor:pointer;

2.

html相对位置和绝对位置布局注意: absolute 说当position属性设为absolute后,总是按照浏览器窗口来进行定位的,这其实是错误的。

当sub1的position设置为absolute后,其到底以谁为对象进行偏移呢?这里分为两种情况:

(1)当sub1的父对象(或曾祖父,只要是父级对象)parent也设置了position属性,且position的属性值为absolute或者relative时,也就是说,不是默认值的情况,此时sub1按照这个parent来进行定位。

注意,对象虽然确定好了,但有些细节需要您的注意,那就是我们到底以parent的哪个定位点来进行定位呢?如果parent设定了margin,border,padding等属性,那么这个定位点将忽略padding,将会从padding开始的地方(即只从padding的左上角开始)进行定位,这与我们会想当然的以为会以margin的左上端开始定位的想法是不同的。
接下来的问题是,sub2的位置到哪里去了呢?由于当position设置为absolute后,会导致sub1溢出正常的文档流,就像它不属于parent一样,它漂浮了起来,在DreamWeaver中把它称为“层”,其实意思是一样的。此时sub2将获得sub1的位置,它的文档流不再基于sub1,而是直接从parent开始。

(2)如果sub1不存在一个有着position属性的父对象,那么那就会以body为定位对象,按照浏览器的窗口进行定位,这个比较容易理解。

3.

css的透明度filter:alpha(opacity=0);opacity:0;-moz-opacity:0; 只有这三个css同时加上才兼容所有的浏览器

4. 窗口关系及框架

top对象始终指向最高(最外)层的框架,也就是浏览器窗口。使用它可以正确访问任何一个框架。因为对于在一个框架中编写的代码中,window对象总是指向的都是那个框架的特定实例,而非最高层的框架。比如说,在子框架中,window是指本身的对象,假使要改变本框架的src及父窗口的iframe或者是frame的src,用window是不行的,这时要用window.top.$(选择器)才能访问
 
标签: 前台 HTML css
反对 0举报 0 评论 0
 

免责声明:本文仅代表作者个人观点,与乐学笔记(本网)无关。其原创性以及文中陈述文字和内容未经本站证实,对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
    本网站有部分内容均转载自其它媒体,转载目的在于传递更多信息,并不代表本网赞同其观点和对其真实性负责,若因作品内容、知识产权、版权和其他问题,请及时提供相关证明等材料并与我们留言联系,本网站将在规定时间内给予删除等相关处理.

  • 前台javascript排序 js排序的几种方式
     script type="text/javascript"$(function () {$('.Sorthead-ShowUp').click(function () { var filed = $(this).attr("name"); $(".issorting").removeClass("issorting"); $(this).addClass("issorting"); D
    03-08
  • 【转】 C#后台调用前台javascript的五种方法
    第一种,OnClientClick    (vs2003不支持这个方法)asp:ButtonID="Button1" runat="server" Text="Button"  OnClientClick="client_click()"OnClick="Button1_Click"  /client_click()就是javascript的一个方法。例如: script type="text/j
    03-08
  • webpages框架中使用Html.TextArea()在前台显示多行信息时,如何进行大小、样式的设置
    webpages框架中使用Html.TextArea()在前台显示
    环境:vs2015 webpages框架+razor语法;目的:服务器进行数据更新操作后,在前台显示更新的相关信息;后台代码:将更新条数等相关信息存储在一个变量中: @{var serverInformation="";if(IsPost){//其他代码//数据库操作serverInformation="相关信息";}}前台
    03-08
  • 前台bootstrap按钮动态添加与删除
    前台bootstrap按钮动态添加与删除
    1.动态添加与删除按钮 initCourse: function(){$("#add").click(function(){addCourse(this,courseInfosMax);});function addCourse(obj,sm){$('#courseInfos').append(     'div'+     'div class="form-group"'+'label clas
    02-08
  • JQuery简单的前台表单验证 jquery表单提交前验
    判断下拉框是否有选择:script type="text/JavaScript"function CheckForm(){var AreaValue=$("#DDlAreaList").val();if(AreaValue=="0"){top.Dialog.altert("请选择区域!");return false;}return true;}/scirpt asp:Button ID="btnSubmit"
    02-08
  • 前台验证框架jQuery-Validation-Engine
    github地址:https://github.com/posabsolute/jQuery-Validation-Engine一个中文文档地址:http://code.ciaoca.com/jquery/validation_engine/普通的验证就不在说了,参考文档以及很明了了。这里写一个field的ajax验证吧。demo 实现功能是一个简单的唯一性的
    02-08
  • (简单详细解决)SpringMVC/SpringBoot 前台页面get不到js,css文件 net::ERR_ABORTED 404
    (简单详细解决)SpringMVC/SpringBoot 前台页面g
    若你导入了js文件或者css文件,加载时却出现上面的情况,而且你也在代码中标记表示引入了。那么不多说了,重启IDEA,简单暴力有效。
    02-08
  • thinkphp前台使用JQuery跳转后台处理后回调
    thinkphp前台使用JQuery跳转后台处理后回调记录。前台htmlinput id="query" type="tel" value="" placeholder="搜索编号查询" autocomplete="off" name="q" size="27"a class="go"name="submit" onClick=
    02-08
点击排行