Fatal编程技术网
  • java/
  • JavaFX WebView Css转换不起作用

JavaFX WebView Css转换不起作用

java css javafx

JavaFX WebView Css转换不起作用,java,css,javafx,javafx-webview,Java,Css,Javafx,Javafx Webview,我正在尝试使用WebView组件加载本地HTML文件。 除了CSS转换之外，一切都很好。 这是我的HTML文件 <!DOCTYPE html> <html> <head> <title>HTML GUI</title> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width

我正在尝试使用WebView组件加载本地HTML文件。 除了CSS转换之外，一切都很好。 这是我的HTML文件

<!DOCTYPE html>

<html>
    <head>
        <title>HTML GUI</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <style>

            input[type=text]{
                padding: 5px;
                text-align: center;
                -webkit-transition: width 2s;
                transition: width 2s;
            }

            input[type=text]:focus{
                width: 80%;
            }

        </style>
    </head>
    <body>
        <div id="welcomeText">Welcome</div>

        <div id="user-block">
            <label>User Name:</label>
            <input type="text"/>
        </div>

        <div id="pw-block">
            <label>Password:</label>
            <input type="text"/>
        </div>

    </body>
</html>


HTML图形用户界面
输入[类型=文本]{
填充物：5px；
文本对齐：居中；
-webkit过渡：宽度2s；
过渡：宽度2s；
}
输入[类型=文本]：焦点{
宽度：80%；
}
欢迎
用户名：
密码：
问题是，每当我点击输入时，转换就会立即发生。过渡时间完全被忽略。我做错什么了吗？WebView是否支持转换？ 注意：我使用的是JDK 8（1.8）

更新：已修复
我已通过为输入指定宽度来修复它…

将转换属性放置在
input[type=text]：focus
block中是否有帮助？同样的问题。我已经通过为输入指定一个宽度来修复它。。。