Question

enter image description here 我有一个奇怪的问题，我正在为我的自举手风琴镀铬，每当我将手风琴从其默认状态切换时，

文字似乎变得更暗，有时会在铬上模糊，

<div class="accordionbg">
        <div class="accordion" id="accordion">
    <div class="accordion-group panel">
                    <div class="accordion-heading">
                    <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" href="#collapse295" id="accordion4">
                        <i></i>Certification </a>
                    </div>
                    <div id="collapse295" class="accordion-body collapse in" style="height: auto;">
                        <div class="accordion-inner">
            <p>On successful completions of assignments &amp; projects, you will be provided a Skillspeed certificate stating your satisfactory performance on the course.</p>

                        </div>
                    </div>
                </div>
    .......

</div>
</div>

我正在使用bootstraps默认手风琴，手风琴中没有应用，页面可以在this site here

访问

我做了一些研究，可能是因为应用了css3过渡，但我完全无能为力。任何指针都会受到赞赏。

Answer 1

我遇到了同样的问题。我尝试了1.答案的解决方案，但它在我的Chrome中没有用（对不起）。我对文本框使用“transform：rotate（-1deg）”，另一个向文本框内的文本旋转（1deg），以便水平读取它。这就是我的文字模糊的原因。我的解决方案是将整个div放在另一个div中并将其设置为rotate（0deg）。像这样：

static {
        kafkaProps.put("bootstrap.servers", "localhost:9092");
        kafkaProps.put(ConsumerConfig.KEY_DESERIALIZER_CLASS_CONFIG, KafkaAvroDeserializer.class);
        kafkaProps.put(ConsumerConfig.VALUE_DESERIALIZER_CLASS_CONFIG, KafkaAvroDeserializer.class);
        kafkaProps.put(ConsumerConfig.GROUP_ID_CONFIG, "CustomerCountryGroup1");
        kafkaProps.put("schema.registry.url", "http://localhost:8081");
    }

    public static void infiniteConsumer() throws IOException {
        try(KafkaConsumer<String, byte[]> kafkaConsumer = new KafkaConsumer<>(kafkaProps)) {
            kafkaConsumer.subscribe(Arrays.asList("CustomerSpecificCountry"));

            while(true) {
                ConsumerRecords<String, byte[]> records = kafkaConsumer.poll(100);
                System.out.println("<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<" + records.count());

                Schema.Parser parser = new Schema.Parser();
                Schema schema = parser.parse(AvroSpecificDeserializer.class
                        .getClassLoader().getResourceAsStream("avro/customer.avsc"));

                records.forEach(record -> {
                    DatumReader<Customer> customerDatumReader = new SpecificDatumReader<>(schema);
                    BinaryDecoder binaryDecoder = DecoderFactory.get().binaryDecoder(record.value(), null);
                    try {
                        System.out.println(">>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>");
                        Customer customer = customerDatumReader.read(null, binaryDecoder);
                        System.out.println(customer);
                    } catch (IOException e) {
                        e.printStackTrace();
                    }
                });
            }

        }
    }

在“ouside-fix-box”造型后，我的文字再次变得清晰。我希望这对你也有帮助！

Answer 2

在Chrome之前我自己遇到过这个问题但虽然不完全令人满意，但我选择使用

-webkit-transform: translate(0,0);

关于受影响的元素（p，h1等）..它基本上“扁平化”文本，我无法隔离示例中不同插件文件之间的阴影被拉入的位置。如果您想了解更多信息，可以阅读有关webkit-transform here的更多信息。

这是不好的做法，但您可以将该代码应用到

    <body>

元素。

您还在使用您的skillspeed.css文件中没有粗体字体重量变化的Roboto字体，因此浏览器呈现的是“虚假”粗体，这也无济于事。尝试用@import替换链接 'http://fonts.googleapis.com/css?family=Roboto:400,700'也可以提供帮助。

Bootstrap手风琴在切换和滚动上显示模糊文本

2 个答案: