How to set width and height of layui date control

To set the width and height of the layui date control, there are two methods: setting through CSS style sheet, for example: .laydate-main { width: 300px; height: 400px; }. Call the laydate.done hook function in JavaScript code, for example: layui.laydate.render({ elem: '#test', done: function() { $(".laydate-main").width(300).height( 400); }});

How to set the width and height of the layui date control

layui is a popular JavaScript framework that provides rich UI components, including date controls. To set the width and height of the date control, there are the following two methods:

Method 1: CSS style

Through the CSS style sheet, you can set the width and height of the date control:

<code class="css">.laydate-main {
  width: 300px;
  height: 400px;
}</code>

Method 2: JavaScript code

In JavaScript code, you can set the width and height by calling the done hook function of the date control:

<code class="javascript">layui.laydate.render({
  elem: '#test',
  done: function(value, date, endDate) {
    // 设置宽高
    $(".laydate-main").width(300).height(400);
  }
});</code>

Through these two methods, the width and height of the layui date control can be flexibly set to meet different layout needs.

The above is the detailed content of How to set width and height of layui date control. For more information, please follow other related articles on the PHP Chinese website!