精华内容
下载资源
问答
  • 修改父级样式 代码: <div class="right-text-bottom"> <div class="right-text-p">有一个美丽的地方,各族人民在这里生长。密密的寨子紧紧相连,那弯弯的江水日夜流淌……”这里...

    做项目时,会遇到一些零碎的技术点。记录下来以防忘记

    需求:图中圈中的部门是滚动的。不修改父级样式

     

     代码:

    <div class="right-text-bottom">
                    <div class="right-text-p">有一个美丽的地方,各族人民在这里生长。密密的寨子紧紧相连,那弯弯的江水日夜流淌……”这里,26个民族和谐共处,相生有一个美丽的地方,各族人民在这里生长。密密的寨子紧紧相连,那弯弯的江水日夜流淌……”这里,26个民族和谐共处,相生有一个美丽的地方,各族人民在这里生长。密密的寨子紧紧相连,那弯弯的江水日夜流淌……”这里,26个民族和谐共处,相生有一个美丽的地方,各族人民在这里生长。密密的寨子紧紧相连,那弯弯的江水日夜流淌……”这里,26个民族和谐共处,相生有一个美丽的地方,各族人民在这里生长。密密的寨子紧紧相连,那弯弯的江水日夜流淌……”这里,26个民族和谐共处,相生有一个美丽的地方,各族人民在这里生长。密密的寨子紧紧相连,那弯弯的江水日夜流淌……”这里,26个民族和谐共处,相生有一个美丽的地方,各族人民在这里生长。密密的寨子紧紧相连,那弯弯的江水日夜流淌……”这里,
        26个民族和谐共处,相生有一个美丽的地方,各族人民在这里生长。密密的寨子紧紧相连,那弯弯的江水日夜流淌……”这里,26个民族和谐共处,相生 密密的寨子紧紧相连,那弯弯的江水日夜流淌……”这里,26个民族和谐共处,相生
    密密的寨子紧紧相连,那弯弯的江水日夜流淌……”这里,26个民族和谐共处,相生有一个美丽的地方,各族人民在这里生长。密密的寨子紧紧相连,那弯弯的江水日夜流淌……”这里,26个民族和谐共处,相生有一个美丽的地方,各族人民在这里生长。密密的寨子紧紧相连,那弯弯的江水日夜流淌……”这里,26个民族和谐共处,相生有一个美丽的地方,各族人民在这里生长。密密的寨子紧紧相连,那弯弯的江水日夜流淌……”这里,26个民族和谐共处,相生有一个美丽的地方,各族人民在这里生长。密密的寨子紧紧相连,那弯弯的江水日夜流淌……”这里,26个民族和谐共处,相生有一个美丽的地方,各族人民在这里生长。密密的寨子紧紧相连,那弯弯的江水日夜流淌……”这里,26个民族和谐共处,相生有一个美丽的地方,各族人民在这里生长。密密的寨子紧紧相连,那弯弯的江水日夜流淌……”这里,26个民族和谐共处,相生有一个美丽的地方,各族人民在这里生长。密密的寨子紧紧相连,那弯弯的江水日夜流淌……”这里,
        26个民族和谐共处,相生有一个美丽的地方,各族人民在这里生长。密密的寨子紧紧相连,那弯弯的江水日夜流淌……”这里,26个民族和谐共处,相生 密密的寨子紧紧相连,那弯弯的江水日夜流淌……”这里,26个民族和谐共处,相生
    密密的寨子紧紧相连,那弯弯的江水日夜流淌……”这里,26个民族和谐共处,相生有一个美丽的地方,各族人民在这里生长。密密的寨子紧紧相连,那弯弯的江水日夜流淌……”这里,26个民族和谐共处,相生有一个美丽的地方,各族人民在这里生长。密密的寨子紧紧相连,那弯弯的江水日夜流淌……”这里,26个民族和谐共处,相生有一个美丽的地方,各族人民在这里生长。密密的寨子紧紧相连,那弯弯的江水日夜流淌……”这里,26个民族和谐共处,相生有一个美丽的地方,各族人民在这里生长。密密的寨子紧紧相连,那弯弯的江水日夜流淌……”这里,26个民族和谐共处,相生有一个美丽的地方,各族人民在这里生长。密密的寨子紧紧相连,那弯弯的江水日夜流淌……”这里,26个民族和谐共处,相生有一个美丽的地方,各族人民在这里生长。密密的寨子紧紧相连,那弯弯的江水日夜流淌……”这里,26个民族和谐共处,相生有一个美丽的地方,各族人民在这里生长。密密的寨子紧紧相连,那弯弯的江水日夜流淌……”这里,
        26个民族和谐共处,相生有一个美丽的地方,各族人民在这里生长。密密的寨子紧紧相连,那弯弯的江水日夜流淌……”这里,26个民族和谐共处,相生 密密的寨子紧紧相连,那弯弯的江水日夜流淌……”这里,26个民族和谐共处,相生
    密密的寨子紧紧相连,那弯弯的江水日夜流淌……”这里,26个民族和谐共处,相生
                    </div>
                    <!-- <div class="parent">
                            <div class="child">
                            Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                            ...
                    </div> -->
                </div>
    .right-text-bottom {
        width: 90%;
        height: 64%;
        overflow: hidden;
        /* border: 1px dashed red; */
    }
    .right-text-p {
        padding: 0 8% 0 3%;
        text-align: left;
        line-height: 2.4em;
        font-size: 1.3em;
        color: #333333;
        text-indent: 2em;
        white-space: pre-wrap;
        height: 90%;
        width: calc(100% + 1em);
        overflow: auto;
    }

    有不同的观点或者实现方式。欢迎在评论区告诉我。

    转载于:https://www.cnblogs.com/clwydjgs/p/11412300.html

    展开全文
  • iframe获取父级标签及控制父级样式

    千次阅读 2017-10-31 12:06:47
    在iframe层的Js中控制父级css样式,以实现覆盖整个页面的弹层遮罩。

    预实现的功能:在iframe层的Js中控制父级css样式,以实现覆盖整个页面的弹层遮罩。

    父级HTML 内容

    <div id="main-shade">
    	<p>提交中,请稍后...</p>
    </div>
    父级 CSS样式

    #main-shade{
    	display: none;
    	position: fixed;
    	top: 0;
    	left:0;
    	width: 100%;
    	height: 100%;
    	z-index: 999;
    	background: rgba(0,0,0,0.4);
    }
    #main-shade p{
    	position: absolute;
    	top: 50%;
    	left: 50%;
    	width: 100px;
    	height: 40px;
    	line-height: 40px;
    	margin: -50px 0 0 -20px;
    	font-size: 20px;
    	text-align: center;
    	background: blue;
    }



    问题:在iframe中的js无法直接通过id或类名控制父级样式


    解决办法:

    利用搜索工具搜索到如下解决办法

    1.获取iframe 的父级id 为mask的内容。

    $('#main-shade',window.parent.document);


    2.控制iframe 父级 id为mask绑定事件

    $('#main-shade',window.parent.document).on('click', function(){

    ...//事件

    });

    3.设置iframe 父级id为.mask 设置css样式

    $('#main-shade',window.parent.document).css("display","block");

    展开全文
  • 我希望js只需更改父级 section 的html数据属性,就可以控制它的子DIV 的样式。我用css的 attr() 获取数据属性,然后存为css 变量。然后所有子DIV,应用父级变量。为什么不对? 具体该怎么写?1234section {--bgurl:...

    我希望js只需更改父级 section 的html数据属性,就可以控制它的子DIV 的样式。

    我用css的 attr() 获取数据属性,然后存为css 变量。然后所有子DIV,应用父级变量。

    为什么不对? 具体该怎么写?

    1
    2
    3
    4

    section {

    --bgurl:attr(url);

    --num:attr(num);

    }

    section div{

    background-image: url(var(--bgurl));

    filter: blur(var(--num)px);

    }

    回答

    注意:  attr() 理论上能用于所有的CSS属性但目前支持的仅有伪元素的 content 属性,其他的属性和高级特性目前是实验性的

    Document

    section div{

    background-image: var(--bgurl);

    filter: blur(var(--num));

    height: 400px;

    color: #fff;

    font-size: 100px;

    }

    1

    var imgs = [

    'https://tse2-mm.cn.bing.net/th/id/OIP.foO_O8mDfOAGzNHcLdgwegHaE8?w=242&h=180&c=7&o=5&dpr=2&pid=1.7',

    'https://tse2-mm.cn.bing.net/th/id/OIP.qZ2wfvLkKt6rS4tLTsz0YAHaEK?w=288&h=180&c=7&o=5&dpr=2&pid=1.7',

    'https://tse4-mm.cn.bing.net/th/id/OIP.XCnKffX9Nc7ca5njltgigQHaEK?w=288&h=180&c=7&o=5&dpr=2&pid=1.7'

    ]

    var $test = document.getElementById('test');

    setInterval(() => $test.style.cssText = `--bgurl: url(${imgs[Math.random()*3|0]});--num:${Math.random()*10}px`, 1000)

    展开全文
  • Jquery查找父级添加样式

    千次阅读 2018-10-15 16:10:57
    Jquery查找父级添加样式 利用jQuery的parents()函数;试用前请先引入核心jQuery.js HTML结构 首页 样式加在的位置 ,navbar navbar...

    Jquery查找父级添加样式

    利用jQuery的parents()函数;试用前请先引入核心jQuery.js

    HTML结构

    1. 样式加在的位置 ,navbar navbar-dropdown bg-color navbar-fixed-top transparent;

    JS

    //鼠标移上去添加背景
    KaTeX parse error: Expected 'EOF', got '#' at position 3: ('#̲navbarNavDropdo…(this),$(this).parent(".xlink-bg"));
    $(this).parents(".xlink-bg").addClass(‘hoverbg’);
    },
    function(){
    $(this).parents(".xlink-bg").removeClass(‘hoverbg’)
    });

    展开全文
  • 在IE8和FF下,DIV 1的边框变成了一条直线,并没有随着内部两个DIV的内容而撑大,原来是因为如果父级DIV没有定义高度,并且内容为空时所定义样式将无效。1、当我们这样直接使用时……ul,p,table,span等文本级别元素这...
  • 在IE8和FF下,DIV1的边框变成了一条直线,并没有随着内部两个DIV的内容而撑大,原来是因为如果父级DIV没有定义高度,并且内容为空时所定义样式将无效我们做DIV+CSS布局时常常如下的做多层DIV的嵌套,可是我们却发现...
  • //修改父级页面头部的样式 window.location = "Avator.aspx"; } 1.父级页面上的图片src会修改,但图片不会显示出来. 2.去掉这句: window.location = "Avator.aspx";就能显示出来 3.且这个问题只在chrome中出现,...
  • html/css更改子级继承的父级属性

    千次阅读 2019-09-11 11:09:53
    一个精美的网页需要的样式很多,在父级上设置的字体颜色或者大小,在其子元素中不一定全部相同,这时候要更改其中某一项的样式怎么办呢。 很多新手朋友就不明白,会迷惑为什么我使用class单独...
  • 浮动很好用,但是用浮动后,当浮动元素的父级元素没有高度时,就会造成高度塌陷,从而影响布局。 一、浮动造成父级高度塌陷的原因 子级使用浮动后,会脱离文档流。父级占据原来的位置,此时父级也没有设置高度,...
  • 1、项目需求:在项目开发中,多级菜单的情况下,勾选子菜单时,需要在父级菜单添加active样式。 2、遇到的问题:一级路由菜单的话,点击当前路由会自动在路由标签上添加router-link-exact-active和router-link-...
  • 这组件创建前设置我的样式,销毁之前移除我设置的样式。 用以下方式给body添加样式: <script> export default { beforeCreate: function() { document.getElementsByTagName("body")[0].class...
  • CSS父级子级学习总结

    千次阅读 2019-03-01 19:54:54
    CSS 父级子级 http://www.divcss5.com/rumen/r239.shtml 1、认识了解 简单讲CSS父级 CSS子级是相对而言,如一个DIV “A”被另外一个DIV “B”包裹着,这样我们就可以认 为B是A父级父级子级或有时把DIV嵌套关系...
  • 获取iframe 父级id 为objid的内容。 $('#objid',window.parent.document).val(""); 初始化为iframe 父级 id为cancel1绑定事件 $('#cancel1',window.parent.document).bind('click', function(){ }); 设置...
  • 在index.vue页面引入 样式和data内的参数请自行整理 主要方法,通过watch校验路由切换 watch: { $route(toRouter) { // console.log(toRouter) //打开的新路由 // console.log(fromRouter) //原先的路由 this....
  • 1,修改父级元素的高度,增加padding-top:1px;的样式模拟,2,为父级元素添加overfl:hidden;样式( 完美 )3,为父级或者子级元素声明浮动 float:left ( 可用)4,为父级元素添加border:1px solid transparent . (老师讲的...
  • delimiters:['${',"}"] //修改插值语法delimiters }); var app2 = new Vue({ el:"#app2", data:{ month:"September", username:"Lily" }, components:{ "myName":{ template:`<div><p>My name is {{ ...
  • layui checkbox 父级子级级联

    千次阅读 2019-06-14 20:17:57
    //添加layui的选中的样式 控制台看元素 e.next().addClass("layui-form-checked"); }); }else{/*如果不是parent*/ //选中子级选中父级 $(data.elem).parent().prev().addClass("layui-form-checked"); } }...
  • 一个精美的网页需要的样式很多,在父级上设置的字体颜色或者大小,在其子元素中不一定全部相同,这时候要更改其中某一项的样式怎么办呢。很多新手朋友就不明白,会迷惑为什么我使用class单独命名了,重新设置了还是...
  • element-ui导航选中节点父级高亮问题

    千次阅读 2019-10-12 15:52:47
    element-ui的导航菜单组件在选中节点后,只有选中节点会高亮,父级并不会高亮。 这在项目层级深或者是菜单收起后无法直观的看到选中项,体验并不是很好! 但是可以通过修改element-ui的css文件进行修改! 具体...
  • 父级隐藏时子级高度获取

    千次阅读 2011-12-07 17:14:39
    有2个iframe 一个iframe是父级是隐藏的一个默认是显示的(其实就是个tab选项卡示例,tab的内容是iframe载入的),这个时候这2个iframe要自适应高度,但是第二个默认隐藏的iframe却怎么都不会获取到高度。 因为如果...
  • 需要在子页面查找iframe外层的div,并修改该div的样式。 var obj = $("iframe[src^='taskController.do?goTaskTab']",window.parent.document);//获得父页面的iframe var objParent = obj.parent();//获得iframe...
  • (如果子元素都需要添加float浮动,可以在父标签里面再添加一个空的div,div样式里面添加clear:both;); 第三种方法:给父级元素设置高度。 第四种方法:给父标签的伪类编写代码(假设类名为clear)  .clea.....
  • 默认展示效果:子级菜单高亮,父级没有高亮 需求效果:子级菜单高亮,父级菜单也会跟着高亮 解决方法: 在对应的页面文件下面加上以下代码即可 <style scoped> ::v-deep.el-submenu.is-active > .el-...
  • 1.先在父级下添加 &lt;span&gt;{{userName}}&lt;/span&gt; 在data中使用userName data() { return { userName: "暂时没有选择用户姓名", } } 2.在select-item标签下添加数据双向...
  • 更改antd 默认样式

    千次阅读 2019-05-08 17:07:30
    更改ant design 默认样式 如果提供的api可以修改样式,则可以通过api直接修改。 如果提供的api达不到想要的效果,可以通过className的方式来修改样式。 例如: 我想修改司机这一行的高度 在控制台中找到对应的样式 ...
  • 关于多子级元素充满父级元素高度的布局方式,听着有些绕口,上个图应该就能很清楚的理解这标题的意思了; 如图:左右分栏的情况下,有顶部和底部导航,且在屏幕高度不定的时候(移动端,多设备适配),如何不适用...
  • 原因: 层叠样式表的优先级中,浏览器为用户设置...而浏览器已经为用户设置了一个默认样式,所以a标签里的内容没有继承父级。 解决方法: 1.使用子代选择器 2.加一句样式a{color:inherit; font:inherit;} 参考...
  • Vue 动态修改dom样式

    万次阅读 2018-07-23 16:11:45
    修改dom样式的思路,无非就是两步: 获取dom 修改样式 一、 vm.$el 修改dom样式 获取dom节点 根节点,即被挂载的dom &amp;lt;div id=&quot;app&quot;&amp;gt; {{info}} &amp;lt;/div&...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 20,154
精华内容 8,061
关键字:

修改父级样式